Posizionamento DIV

[delfina blu]

Sto guardando il mio codice da 1h e non ne vengo a capo ... non trovo l'errore.

Codice CSS

html,body {
	color: #000000;
	background-color: #FFFFFF;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	text-align: left;
	margin: 0px;
}	

#container{	
	clear: both;
	width: 100%;
	background-color: Aqua;
}

#container #newOrder{
	margin-left: 5px;
	margin-top: 5px;
	width: 150px;
	border-width: 	1px;
	border-style: 	solid;
	border-color: 	#575757;
	background-color: Green;
	float: left;	
	clear: both;
}

#container #treeFilter{
	margin-left: 5px;
	margin-top: 5px;
	width: 150px;
	border-width: 	1px;
	border-style: 	solid;
	border-color: 	#575757;
	height: 400px;
	background-color: Maroon;	
	float: left;	
	clear: left;
}

#container #dataPanel{		
	height: 250px;
	background-color: Blue;
	width: 83%;
	margin-left: 10px;
	margin-top: 5px;	
	float: left;	
	clear: right;
}

codice HTML

<div id="container">
	<div id="newOrder">rew</div>
	<div id="treeFilter">rwe</div>	
	<div id="dataPanel">rwe</div>
</div>

questo è il risultato

http://delfinablue.interfree.it/prova.html

Il box verde e il box blu dovrebbero essere allineati, mentre ora il box blu è allineato a quello marrone.
Con IE 6 la visualizzazione è corretta, con FF no.
Cosa mi sta sfuggendo?

Grazie

[Myaku]

stai usando float e clear sullo stesso elemento
Inoltre, quando definisci delle proprietà a più elementi, questi separali con una virgola

[delfina blu]

Originariamente inviato da Myaku
stai usando float e clear sullo stesso elemento
Inoltre, quando definisci delle proprietà a più elementi, questi separali con una virgola

quindi?

inoltre gli elementi sono separati da virgola!!

[Myaku]

Originariamente inviato da delfina blu
quindi?

che il clear va sull'elemento che segue il float
come hai fatto tu, float e clear si riferiscono allo stesso elemento

inoltre gli elementi sono separati da virgola!!

a me non mi pare

#container #dataPanel{

non vedo virgole tra l'id container e l'id dataPanel

#container, #dataPanel{

[delfina blu]

Originariamente inviato da Myaku
che il clear va sull'elemento che segue il float
come hai fatto tu, float e clear si riferiscono allo stesso elemento



a me non mi pare

#container #dataPanel{

non vedo virgole tra l'id container e l'id dataPanel

#container, #dataPanel{

ci deve andare al virgola anche se l'id container contiene id dataPanel?
le due classi non devono avere le medesime caratteristiche, è solo per indicare la gerarchia

potersti per favore darmi una mano con i CSS che mi sto incartando su dove mettere float e/o clear?

grazie

[Myaku]

Originariamente inviato da delfina blu
ci deve andare al virgola anche se l'id container contiene id dataPanel?
le due classi non devono avere le medesime caratteristiche, è solo per indicare la gerarchia

potersti per favore darmi una mano con i CSS che mi sto incartando su dove mettere float e/o clear?

grazie

si. se non li separi, è come se gli dicessi che il tag è il medesimo, mentre sono due diversi div. Altrimenti, dovresti usare i selettori figlio / di discendenza

il box rosso dove deve stare?

[delfina blu]

Originariamente inviato da Myaku
si. se non li separi, è come se gli dicessi che il tag è il medesimo, mentre sono due diversi div. Altrimenti, dovresti usare i selettori figlio / di discendenza

il box rosso dove deve stare?

il verde è al posto giusto
il rosso è al posto giusto
il blu è al posto giusto ma deve essere allineato al verde e non al rosso

la pagina che ho linkato contiene il codice: con IE la visualizzazione è corretta, con FF no

[Myaku]

Originariamente inviato da delfina blu
il verde è al posto giusto
il rosso è al posto giusto
il blu è al posto giusto ma deve essere allineato al verde e non al rosso

la pagina che ho linkato contiene il codice: con IE la visualizzazione è corretta, con FF no

sono su un mac, ho FF ma non IE. Comunque,

<div id="container">
<div id="left">
 <div id="verde"></div>
 <div id="rosso"></div>
</div>
<div id="blu"></div>
<div id="clear"></div>
</div>

dai float:left a div #left
float:right a div #blu
clear:both a #clear

poi ovviamente i nomi giusti agli id li metti tu come ti pare

[delfina blu]

Originariamente inviato da Myaku
sono su un mac, ho FF ma non IE. Comunque,

<div id="container">
<div id="left">
 <div id="verde"></div>
 <div id="rosso"></div>
</div>
<div id="blu"></div>
<div id="clear"></div>
</div>

dai float:left a div #left
float:right a div #blu
clear:both a #clear

poi ovviamente i nomi giusti agli id li metti tu come ti pare

perdonami, ma la tua struttura oltre che essere errata, è differente dalla mia, un bel po'

[Sgro]

Originariamente inviato da Myaku
si. se non li separi, è come se gli dicessi che il tag è il medesimo, mentre sono due diversi div. Altrimenti, dovresti usare i selettori figlio / di discendenza

il box rosso dove deve stare?

Perdonami Myaku, ma indicare 2 selettori separati da spazio equivale ad usare il simbolo di discendenza ">". Quindi nel suo caso la struttura dei selettori è corretta. Se poi vogliamo dire che è inutile specificare la discendenza a due selettori di id (in quanto gli id sono comunque univoci) allora è un altro paio di maniche

Ciao