3 hasáb + float + clear:both probléma
Az oldalamon 3 hasábot használok az alábbi megoldással:
- a frame_body szélessége lehet változó
- a frame_body_left és frame_body_right mindig 200px és floatolva vannak
- a frame_body_center nem floatolt, de a margók beállításával középen helyezkedik el, szélessége lehet változó
A problémám az lenne, hogy vannak olyan esetek, amikor a középső részbe (frame_body_center) egy olyan div kerül, aminek be van állítva, hogy clear:both, de erre hatással lesz a frame_body_left (mondjuk elég sok tartalom van benne), egy hatalmas rés keletkezik a középső tartalomban. Hogyan lehetne ezt kiküszöbölni?
- az a megoldás nem jó, hogy a középső div is float left, mert akkor nem tudom a szélességét automatikusan változtatni.
■ - a frame_body szélessége lehet változó
- a frame_body_left és frame_body_right mindig 200px és floatolva vannak
- a frame_body_center nem floatolt, de a margók beállításával középen helyezkedik el, szélessége lehet változó
A problémám az lenne, hogy vannak olyan esetek, amikor a középső részbe (frame_body_center) egy olyan div kerül, aminek be van állítva, hogy clear:both, de erre hatással lesz a frame_body_left (mondjuk elég sok tartalom van benne), egy hatalmas rés keletkezik a középső tartalomban. Hogyan lehetne ezt kiküszöbölni?
- az a megoldás nem jó, hogy a középső div is float left, mert akkor nem tudom a szélességét automatikusan változtatni.
#frame_body {
width: auto;
display: block;
}
#frame_body_left {
width: 200px;
float: left;
}
#frame_body_center {
margin: 2px 210px 2px 210px;
display: block;
}
#frame_body_right {
width: 200px;
float: right;
}
.closer {
clear: both;
}
<div id="frame_body">
<div id="frame_body_left"></div>
<div id="frame_body_right"></div>
<div id="frame_body_center"></div>
<div class="closer"></div>
</div>
CSS Layout
Keresőbarátság szempontjából fontos lehet, hogy a forrásban ne a semmitmondó menü-hasábok legyenek a fájl elején, hanem amennyire csak tudod előre hozd a valódi tartalmat, tehát az első a frame_body_center kéne legyen.
abszolút pozícionálás
előnyök:
- nem zavar a clear
- a tartalmi rész lehet legelöl a forrásban ahogy bence is mondta
- nyúlhat a tartalom a böngésző szélességével
viszont kérdés hogy biztosan ennyire nyúlós elrendezést szeretnél-e. 1900x1200-as felbontásban hülyét kapnék egy 1500 pixel széles szöveg olvasásától.
fix szelesseg
amit javasoltal, annak van egy olyan problemaja, hogy ha az absolute-ra allitott divek magassaga nagyobb mint a center div-e, akkor bizony ra fog logni a tulnyulo div a footerre.
most azt a megoldast valasztottam atmenetileg, hogy mind a 3 floatolva van es a vegen van egy div amiben a style clear:both