Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 29.05.2005, 02:21
bensen bensen ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 25.08.2004
Beiträge: 5
bensen befindet sich auf einem aufstrebenden Ast
Standard floating Problematik bei verschachtelten div's

Hallo,

folgende Ausgangssituation:

Auf meiner Seite habe ich links ein Menü (id="menu") und rechts daneben einen content-Bereich (id="content"), darunter befindet sich ein footer-Bereich (id="footer"). Dies hab ich wie folgt gelöst:

html:
Code:
<div id="menu"></div>
<div id="content"></div>
<div id="clearer"></div>
<div id="footer"></div>
css:
Code:
#menu {float:left;}
#content {margin-left:150px;}
#clearer {clear:both;}
Das margin deswegen, damit der content Bereich nicht unters Menü fließt, sondern diese "Tabellen-Optik"zustande kommt. "position:relative" fürs Menü würd nicht gehen, da sonst evtl. der footer optisch ins Menü rutschen würde, falls der content-Bereich nicht mindestens die Höhe des Menüs hat.

Nun meine Problematik:

Im Content-Bereich muss ich halt auch die floating-Eigenschaft nutzen muss, um z.B. Bilder vernünftig in meine News einzubinden. Da kommt es allerdings ab und zu vor, dass die Bilder eine größere Höhe haben, als der gesamte Text, der neben ihnen stehen soll. Damit nix Nachfolgendes mit-floatet, hab ich dort natürlich auch div mit "clear:both" eingefügt.
Doch nun hebt dieses im <div id="content"> geschachtelte "clear:both" die floating Eigenschaft des Menüs auf und alles, was nach dem "clear:both" kommt, fängt erst optisch unter dem Menü an!!
Ich hoffe, ich habe mich verständlich ausgedrückt!

Wie kann ich dies verhindern? Ich möchte also quasi die floating Eigenschaft für Elemente innerhlab von id="content" unabhängig nutzen können von der übergeordneten floating Eigenschaft vom Menü!
Geht das irgendwie? Evtl. mit ein paar Tricks...???

Gruß
bensen

[edit]
Ich bitte den Doppelpost zu entschuldigen und entsprechend einen davon zu löschen! Dachte, meine I-net Verbindung wäre tot und hab dewegen zweimal auf Absenden geklickt...
[/edit]
Mit Zitat antworten
Sponsored Links