Float che non si affiancano

**dabbia** · 13-12-2006, 15:20

Sto creando un sito "monolitico" con 3 div (#header, #contenuti e #piedi) posti uno sotto l'altro .
E fin qui non ci sono problemi...

Appena però metto altri 2 div affiancati (#logo e #menu) nell'#header, il div #header si "appiattisce" perdendo l'altezza e #contenuti si va ad affiancare ancora alla destra di #menu, quando invece DOVREBBE stare a capo, come in un classico sito monolitico.

Posto il codice "scarno" per semplicità:

codice:

<html>
<head>

<style>
#logo { width:240px; border:1px solid #FF0000;float:left;} 
#menu {float:left; width:360px; border:1px solid #FF0000; }

</style>
</head>

<body>

<div id="header">
	<div id="logo">[img]images/struttura/logo_piccolo.gif[/img]</div>
	<div id="menu">MENU</div>
</div> 

<div id="contenuti">[img]images/struttura/logo.gif[/img]</div>
</body>
</html>

Potreste darmi una mano o un consiglio? Sto impazzendo tra div, float, clear, position e css senza riuscire a trovare la soluzione!
Grazie

**dabbia** · 13-12-2006, 19:50

up

**Mich_** · 14-12-2006, 10:05

Probabilmente devi mettere il float anche al #header, per farlo funzionare in tutti i browser.

Invece al #contenuti devi dare la proprieta`
clear: left; /* oppure clear: both; */
per togliere l'effetto del float.

**dabbia** · 14-12-2006, 13:24

Meno male che ci sei tu! Grazie 1000, funziona mettendo il float anche a #header!
Non l'avrei mai pensato...
Grazie ancora

Discussione: Float che non si affiancano

Strumenti discussione

Ricerca discussione

Visualizza

Float che non si affiancano

Permessi di invio