Care e logica?

Am un div care mai contine inca 3 div-uri. unul cu text in stanga, unul in dreapta, unul in centru. Am facut deci primul div ca pe un container pentru celelalte 3. Le-am pus in ordinea asta:

<div id="container">
<div id="text-left">Text stanga</div>
<div id="text-center">Text centrat</div>
<div id="text-right">Text dreapta</div>
</div>

unde "text-left" e float:left
"text-center" e text-align:center
"text-right" e float:right

Toate bune si frumoase dpdv logic dar: "Text dreapta" se duce un rand mai jos, chiar daca "container" e fixat pe o pozitie cu un anumit width, pe care niciunul din texte nu-l intrece. Deci nu are de ce sa treaca pe randul urmator...si totusi o face.

Aveti idee de ce?

Bine, daca schimb ordinea, adica:

<div id="container">
<div id="text-left">Text stanga</div>
<div id="text-right">Text dreapta</div>
<div id="text-center">Text centrat</div>
</div>

e ok, doar ca mi se pare aiurea ca "center" sa fie dupa left si right :)

Intreb de curiozitate, ca problema oricum am rezolvat-o asa :P

Citat:

---

#text-center {float: left;}

---

Si sta cum trebuie. Mai stabilesti niste width-uri pentru cele 3 coloane si e ok.

Toate 3 div-urile cu float:left;
Iar inainte de inchiderea containerului (</div>) <div style="clear:left;"></div> ca sa nu o ia razna dedesubt.

mersi, nu stiam de clear :)

nu tot ce e logic se aplica in html :)

un pic offtopic: v-ati lovit de probleme pentru ca IE face re-rendering de pagina la scroll ? Adica re-deseneaza pagina cand faci scroll.
Un exemplu foarte intalnit: ai un box cu border din css si pe IE, cand dai scroll, dispar parti din borderul ala.