div layout probleme

Seite 1 von 1 - Forum: Coding Stuff auf overclockers.at

URL: https://www.overclockers.at/coding-stuff/div_layout_probleme_199256/page_1 - zur Vollversion wechseln!

Umlüx schrieb am 04.09.2008 um 11:33

eigentlich ganz simpel, aber ich steh grad am schlauch, denkfehler, deppat etc..
ich möchte 3 <div> container nebeneinander plazieren. der linke und rechte sollen eine fixe breite haben und menüs darstellen
der mittlere ist der content und soll sich in der breite anpassen.

Code: PHP

<div style="  float:left; width:100px">
menublahblah
</div>

<div style="  float:left">
text text text text text text  
</div>

<div style="  float:right; width:50px">
menu2
</div>

mein problem an der sache ist nun dass das rechte menü immer unter den content rutscht wenn ich viel text hab oder das browserfenster verkleiner. ich spiel mich jetzt schon ewig hier rum und komm auf keinen grünen zweig..

halp plox

Spikx schrieb am 04.09.2008 um 12:33

Hm, so zB?:

Code: PHP

<div style="min-width:800px;">
	<div style="float:left; width:200px; height:600px; background:#45A8DF"></div>
	<div style="float:right; width:200px; height:600px; background:#45A8DF"></div>
	<div style="margin-left:200px; margin-right:200px; min-height:600px; background:#B3DAEF">content</div>
	<div style="clear:both"></div>
</div>

//hinweis: IE (selbst der 7er) kann kein min-width/height, da gibt es aber einen kleinen hack
//² hack:

Code: PHP

height:auto!important;height:600px;min-height:600px;

IE implementiert height nämlich so wie min-height. Darüberhinaus versteht der IE das !important nicht. Somit interpretiert der FF etc. diese Angabe dann nur mit min-height und der IE nur das height

Umlüx schrieb am 04.09.2008 um 13:30

aah du hast das gar ned im textfluss sondern per margins einfach mittig plaziert? interessant

Spikx schrieb am 04.09.2008 um 13:37

Jop, wüsste eigentlich auch gar nicht wie's anders funktionieren könnte . Außer ma nimmt tables :P

Umlüx schrieb am 04.09.2008 um 13:45

tables? neh! geh weg damit aber geht wunderbar, dank dir.