ugrás a tartalomhoz

Táblázat nélkül

Ajnasz · 2004. Aug. 26. (Cs), 11.09
A minap próbálkoztam azzal a megoldással, mellyel táblázat nélkül szerettem volna rendezni a különböző elemeket.

Középen van a mindent tartalmazó main id attribútummal bíró div tag.
Ezt szerettem volna felosztani két oszlopra floattal.

#main #left valamint #main #right

A probléma a firfox böngészővel adódott. A floattal jelzett blokkok egyszerűen a "main" alá kerülnek és nem bele.

A html forrás a következő (butítva):

<div id="main">

  <div id="left">
    <p>blah-blah</p>
  </div>

  <div id="right">
    <p>blah-blah</p>
  </div>

</div>


A css, ugyancsak butítva:
#main {
margin: 10px auto 10px auto;
width: 800px;
}
#main #right {
float: right;
width: 150px;
}
#main #left {
width: 650px;
float: left;
}


Csak a firefoxban nem akar működni. Hol, mit a hibáztam?
 
1

float az lebeg

Jano · 2004. Aug. 26. (Cs), 12.38
Hello!

Az ala kerul gondolom azt jelenti, hogy a main nem foglalja magaba a belso DIV-eket. Ez azert van mert a float az lebeg es nincs hatassal a merete az ot tartalmazo dobozra.

Kelle egy olyan elem ami a floatolt elemek utan van, meg benne a main DIV-ben es nincs floatolva. Ez az elem fogja kenyszeriteni a main divet, hogy lehuzodjon egeszen a 2 belso elem aljaig.

Itt van a problema elmagyarazva es egy megoldas leirva:
Containing Floats

Es itt egy olyan pelda ahol plussz elem nelkul oldja meg a problemat:
How To Clear Floats Without Structural Markup
2

#main #right { margin-left:

kilvadi · 2004. Aug. 26. (Cs), 12.43
#main #right {
margin-left: 650px;
}
#main #left {
width: 650px;
float: left;
}

<-/kilvadi/->
4

ha left hosszabb kilog

Jano · 2004. Aug. 26. (Cs), 14.46
Igy is ki fog logni abban az esetben ha a bal hosszabb mint a jobb.

Es befog jonni az IE 3px hiba mert csak egyik van floatolva.
3

Köszönöm a segítséget.

Ajnasz · 2004. Aug. 26. (Cs), 13.21
Köszönöm a segítséget. Így sikerült megoldani problémát.