|
|||
2x float:left; innerhalb eines Divs verwenden
Ich möchte folgende Struktur anwenden. Allerdings macht FF (1.5.0.3) nicht mit (normaleweise habe bei sowas oft mit IE Probleme...)
Und zwar werden die Divs left_cont und right_cont unterhalb von inner_cont angezeigt, sie müssen aber innhalb angezeigt werden. Wo ist das Problem? Bei IE funktioniert es einwandfrei. Wenn ich float:left; rausnehme, dann sind die Div wieder innhalb von inner_cont aber stehen nicht mehr nebeneinander. Code:
<div id="inner_cont"> <div id="left_cont"> <div id="navigation"> Text Text Text Text </div> </div> <div id="right_cont">Inhalt</div> </div> Code:
#inner_cont { border:1px solid #FF0000; background-color:#FFFFFF; background-image:url(../img/inner_cont_bg.gif); } #left_cont { float:left; width:165px; height:600px; margin-right:5px; background-color:#cccccc; } #right_cont { float:left; width:560px; padding-bottom:15px; }
__________________
-> Praktikanten-Netzwerk.de zu verkaufen -> Community für Webmaster -> Kostenloses Forenverzeichnis |
Sponsored Links |
|
||||
Das Problem ist, dass du nicht ordentlich clearst nach dem floaten. Dass der IE das ohne clear korrekt anzeigt, ist ein Fehler.
__________________
“My software never has bugs. It just develops random features ...” » DevShack - die Website des freien Webentwicklers Boris Bojic |
Sponsored Links |
|
|||
Zitat:
Ok, jetzt stellt sich aber die Frage, welche von den 3 Divs gecleart werden muss. Bei inner_cont macht das keinen Sinn, muss ich dann einen weiteren Div hinzufügen? Nachtrag: Ich habe Code:
<br clear="all" />
__________________
-> Praktikanten-Netzwerk.de zu verkaufen -> Community für Webmaster -> Kostenloses Forenverzeichnis |
|
|||
Wenn du das float:left; aus #right_cont entfernst hast du den gewünschten Effekt. #left_cont und #right_cont sind innerhalb von #inner_cont, doch nur #right_cont nimmt Einfluss auf die Höhe von #inner_cont. Clearen muss du dann glaube ich auch nicht mehr.
|
|
|||
Danke für die Anwort, es gibt aber einen Grund, warum ich #inner_cont verwende. Die Navigation, also #left_cont soll eine Hintergrundfarbe bekommen. Damit die zwei divs aber einheitlich aussehen, also gleich groß sind definiere ich in der #inner_cont ein Hintergrundbild.
Wenn ich #inner_cont nicht hätte, würde das Hintergrundbild auf der gesamten Seite dargestellt.
__________________
-> Praktikanten-Netzwerk.de zu verkaufen -> Community für Webmaster -> Kostenloses Forenverzeichnis |
|
|||
Also ich meinte ja nicht das du auf #inner_cont verzichten sollst. Um die beiden #left_cont und #right_cont gleich Hoch zu kriegen, könntest du jauch bei #right_cont ein min-height: [Hoehe von #left_cont]; einsetzen. Dabei daran denken das der IE das nicht versteht, also * html Hack einsetzen.
|
|
||||
Das mit den zwei floats ist schon in Ordnung so.
Es gibt verschiedene Methoden, #inner_cont zu clearen. Eine andere, einfache Methode wäre es, #inner_cont eine feste Breite zuzuweisen und ebenfalls ein float: left; einzutragen. Es gibt auch die :after clear Methode (siehe Google), die ich gerne benutze: Code:
#inner_cont:after { content: "."; visibility: hidden; height: 0; display: block; clear: both; }
__________________
“My software never has bugs. It just develops random features ...” » DevShack - die Website des freien Webentwicklers Boris Bojic |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Script nur für Inhalt eines bestimmten DIVs | Kipperdesign | Javascript & Ajax | 8 | 11.02.2013 14:03 |
Bei float:left fliegen Divs raus, trotz mind. Höhe/Breite | o.the.run | CSS | 2 | 23.12.2012 11:38 |
Ratschläge bei Publizierung eines fertigen Layouts gesucht | Black Fladder | CSS | 55 | 05.09.2004 15:30 |
Positinierung eines DIVs innerhalb eines Eltern-DIVs? | Robin | CSS | 0 | 17.08.2004 17:01 |
bilder-abstand innerhalb eines divs????? | xy2er | CSS | 4 | 22.05.2004 01:40 |