No, i float non COPRONO altri elementi float. Eventualmente elementi NON FLOAT messi DOPO elementi float possono "sovrapporsi" se non si usano le regole corrette (margin o clear)
Ad esempio questo
Da il risultato mostrato in figura, poichè:Codice PHP:<html>
<head>
<style>
div#colonna1{float: left; width: 150px; background-color: #ccc}
div#colonna2{float: left; width: 250px; background-color: #99f}
div#colonna3{float: right; width: 100px; background-color: #ff9}
div#centro{margin-left:400px; background-color: #9f9; margin-right: 100px;}
div#sotto{clear: both; background-color: #f99}
</style>
</head>
<body>
<div id="colonna1">Colonna 1</div>
<div id="colonna2">Colonna 1</div>
<div id="colonna3">Colonna 3</div>
<div id="centro">Centro</div>
<div id="sotto">Sotto</div>
</body>
</html>
1) Colonna 1 è floattato e va a sinistra
2) Colonna 2 è floattato e si attacca a colonna 1 (tra floattati non si coprono)
3) Colonna 3 è flottato a destra
4) Colonna 4 non è floattato ma ha i margini a sinistra e destra sufficienti larghi proprio quanto la somma delle relative colonne (400px a sinistra e 100 a destra) evitando quindi sovrapposizioni
5) Sotto non è floattato ma ha "clear:both" che impedisce comunque qualsiasi sovrapposizione con elementi floattati sia a destra che a sinistra
P.S.
Ricorda, gli elementi float devono SEMPRE avere una larghezza DEFINITA (width). Per l'altezza non c'è problema poichè basta mettere sotto di loro un elemento con clear: both e sei a posto
Rispondi quotando