|
|||
Container ineinander Schachteln
Hallo Miteinander,
ich habe ein kleines CSS-Problem. Ich habe ein äußeren und 2 innere Container. Der äußere Container hat eine Höhe von 700px. Der innere Container hat die Höhe 100%. Nun geht aber nicht der innere Container bis zum äußeren, so wie von mir gewünscht, sondern bis zum Ende des Browser-Fensters. Wo liegt das Problem? Warum überlappt der innere den äußeren Container? Hier mal der Code: Code:
body{ background-color: grey; background-image: url(../images/background.jpg); background-repeat: repeat; font-family: Tahoma,Verdana,Arial; font-size: 9pt; color: #3c3c3c; margin:0; } div.frame{ width: 800px; border: 1px solid; border-color: #3c3c3c; margin-left: auto; margin-right: auto; height:700px; background-color:white; } div.banner{ width:800px; height:125px; background-color:blue; background-image: url(../s/banner.jpg); } div.bar{ width:800px; height:30px; background-image: url(../imasges/bar_dark.jpg); background-repeat: repeat-x; background-color:green; } div.contLeft{ float:left; width:180px; min-height:10px; height:100%; background-color: #bbbaba; } div.contRight{ float:left; width:600px; background-color:red; padding:10px; padding-top:20px; height:100%; margin:0px; } Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN"> <html> <head> <title>Title</title> <link rel="stylesheet" type="text/css" href="css/style.css"> </head> <body><div class="frame"> <div class="banner"></div> <div class="bar"></div> <div class="contLeft"></div> <div class="contRight">Test</div> </div> </body> </html> |
Sponsored Links |
|
|||
Laut Definition des Boxmodells, musst du auf deine 100% height noch die 30px padding-top/-bottom dazurechnen. Folglich ist deine Box höher, als 100%. Und außerdem kommen natürlich auch noch die Höhen der anderen Elemente in #frame dazu.
Wenn du die Höhen eh alle fix hast, warum gibst du den Elementen, die bis runter gehen sollen nicht einfach auch fixe Pixelwerte? Geändert von regloh (05.08.2009 um 10:03 Uhr) |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Rechtecke ineinander schachteln | Tobe | Grafik, Design, Typografie | 6 | 25.07.2008 18:33 |
Positionierung von Container horizontal | mayhemtl | CSS | 9 | 11.08.2007 15:25 |
div container verschachteln | blau | CSS | 2 | 05.12.2006 19:44 |
Container nebeneinader, ineinander ohne sich zu verschieben | X-Tractor | CSS | 0 | 05.12.2005 01:02 |
Container nimmt nicht die Höhe seines Inhalts an | Lestat | CSS | 10 | 04.08.2005 13:47 |