So am Rande ist Float nicht grade das Beste in CSS, es kann zwar schon so einiges aber macht auch sehr viel mal schnell kaputt, ist so wie MS Word man bearbeitet das Dokument unten und oben geht alles kaputt.
Als Vorschlag kann ich dir mit CSS die Flex Boxen ans Herzen legen.
Hab ich das eigentlich richtig verstanden das es ungefähr so sein soll?
HTML Datei: ( index.html )
habe um top und textbereich ein DIV gemacht und es die ID middle gegeben
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- saved from url=(0026)http://test.dukevision.de/ -->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
<meta name="author" content="MedievalDukemon">
<meta name="editor" content="html-editor phase 5">
<link href="./test.dukevision.de_files/allgemein.css" rel="stylesheet" media="screen" charset="utf-8">
<link href="./test.dukevision.de_files/formatierungen.css" rel="stylesheet" media="screen" charset="utf-8">
</head>
<body>
<div id="wrapper">
<div id="links">
<div id="logo"><img src="./test.dukevision.de_files/logo-off.png" alt="Dukevision" id="logobild"></div>
<div id="navigation">
<p id="k2">Navigation</p>
</div>
</div>
<div id="middle">
<div id="top">
<div id="banner"><img src="./test.dukevision.de_files/dukevision-banner300.png"
alt="Downloads f�r Die Sims 4. Spieletipps. Rezensionen" id="bannerbild"></div>
</div>
<div id="textbereich">
<p>Auch gibt es niemanden, der den Schmerz an sich liebt, sucht oder wünscht, nur, weil er Schmerz ist, es sei denn, es kommt zu zufälligen Umständen, in denen Mühen und Schmerz ihm große Freude bereiten können. Um ein triviales Beispiel zu nehmen, wer von uns unterzieht sich je anstrengender körperlicher Betätigung, außer um Vorteile daraus zu ziehen? Aber wer hat irgend ein Recht, einen Menschen zu tadeln, der die Entscheidung trifft, eine Freude zu genießen, die keine unangenehmen Folgen hat, oder einen, der Schmerz vermeidet, welcher keine daraus resultierende Freude nach sich zieht? Auch gibt es niemanden, der den Schmerz an sich liebt, sucht oder wünscht, nur, weil er Schmerz ist, es sei denn, es kommt zu zufälligen Umständen, in denen Mühen und Schmerz ihm große Freude bereiten können. Um ein triviales Beispiel zu nehmen, wer von uns unterzieht sich je anstrengender körperlicher Betätigung, außer um Vorteile daraus zu ziehen?</p>
<p>Aber wer hat irgend ein Recht, einen Menschen zu tadeln, der die Entscheidung trifft, eine Freude zu genießen, die keine unangenehmen Folgen hat, oder einen, der Schmerz vermeidet, welcher keine daraus resultierende Freude nach sich zieht? Auch gibt es niemanden, der den Schmerz an sich liebt, sucht oder wünscht, nur, weil er Schmerz ist, es sei denn, es kommt zu zufälligen Umständen, in denen Mühen und Schmerz ihm große Freude bereiten können. Um ein triviales Beispiel zu nehmen, wer von uns unterzieht sich je anstrengender körperlicher Betätigung, außer um Vorteile daraus zu ziehen? Aber wer hat irgend ein Recht, einen Menschen zu tadeln, der die Entscheidung trifft, eine Freude zu genießen, die keine unangenehmen Folgen hat, oder einen, der Schmerz vermeidet, welcher keine daraus resultierende Freude nach sich zieht? Auch gibt es niemanden, der den Schmerz an sich liebt, sucht oder wünscht, nur, weil er Schmerz ist, es sei denn, es kommt zu zufälligen Umständen, in denen Mühen und Schmerz ihm große Freude bereiten können. Um ein triviales Beispiel zu nehmen, wer von uns unterzieht sich je anstrengender körperlicher Betätigung, außer um Vorteile daraus zu ziehen? Aber wer hat irgend ein Recht, einen Menschen zu tadeln, der die Entscheidung trifft, eine Freude zu genießen, die keine unangenehmen Folgen hat, oder einen, der Schmerz vermeidet, welcher keine daraus resultierende Freude nach sich zieht? Auch gibt es niemanden, der den Schmerz an sich liebt, sucht oder wünscht, nur, weil er Schmerz ist, es sei denn, es kommt zu zufälligen Umständen, in denen</p>
</div>
</div>
<div id="rechte"></div>
</div>
<div id="syno-notification-is-installed"></div>
</body>
</html>
Alles anzeigen
CSS Datei: (allgemein.css)
#Wrapper zu einer Flex Box gemacht mit display:flex;
Floats entfernt und größen verändert.
body {
background-color: #66ccff;
color: black;
margin: 0px;
padding: 0px;
display: block;
}
div#wrapper {
background: rgba(0,0,0,0);
margin: 0px;
padding: 0px;
border: 0px black solid;
/* min-width: 680px;
max-width: 680px; */
width: auto;
height: auto;
display: flex;
}
div#links {
background-color: #3366cc;
color: black;
border-left: 5px #cccc00 solid;
border-top: 5px #cccc00 solid;
border-bottom: 5px #cccc00 solid;
border-right: 0px;
padding-left: 1px;
min-width: 200px;
max-width: 205px;
height: 540px;
margin: 0px;
z-index: 1;
}
div#logo {
background: rgba(0,0,0,0);
border: 0px black solid;
margin: 25px;
width: auto;
height: auto;
position: relativ;
z-index: 2;
}
div#navigation {
background: rgba(0,0,0,0);
border: 1px black solid;
margin: 1px;
margin-top: 0.6em;
min-width: 195px;
max-width: 200px;
min-height: 200px;
max-height: auto;
position: relativ;
z-index: 1;
}
div#middle{
border-top: 5px #cccc00 solid;
border-bottom: 5px #cccc00 solid;
}
div#top {
background-color: #3366cc;
color: black;
border-left: 0px;
border-right: 0px;
padding: 0px;
width: 380px;
height: 180px;
margin: 0px;
z-index: 1;
}
div#banner {
background-color: white;
border: 0px;
margin-top: 5px;
margin-bottom: 5px;
margin-left: 6px;
margin-right: 6px;
width: 360px;
height: 140px;
padding: 0px;
position: absolute;
z-index: 2;
}
div#textbereich {
border: 1px black solid;
padding: 5px;
width: 368px;
height: 348px;
overflow-y: auto;
margin: 0px;
z-index: 1;
}
div#rechte {
background-color: #3366cc;
color: black;
border-left: 0xp;
border-top: 5px #cccc00 solid;
border-bottom: 5px #cccc00 solid;
border-right: 5px #cccc00 solid;
padding-left: 0px;
min-width: 40px;
max-width: 45px;
height: 540px;
margin: 0px;
z-index: 1;
}
Alles anzeigen
Sollte das Menü mitwachsen sowie die rechte Leiste dann bei div#links und div#rechts die height entfernen bzw auskommentieren, dann sollten die mit dem Code den ich gesendet habe mitwachsen ( habs eben getestet) .