Strano comportamento di IE8 con div e float

[gpalmia]

Ciao a tutti.
Ho un piccolo problema che non riesco a risolvere.
vorrei semplicemente inserire due elementi div all'interno di un altro che faccia da contenitore così...:

<div id="corpo">
<div id="colsx">
	

Colonna di sinistra</p>
</div>
<div id="coldx">
	

Colonna di destra</p>
</div>
</div>

il tutto è molto semplice e l'unica cosa che vorrei è che i due elementi div interni siano allineati orrizzontalmente uno a destra e l'altro a sx.
Ho così creato il file css con questo codice

div#colsx {
	border: thin #C0C0C0 solid;
	background-color: #00FFFF;
	margin: 2%;
	width: 30%;
	float:left;
}

div#coldx {
	border: thin #C0C0C0 solid;
	background-color: #00FFFF;
	margin: 2%;
	width: 30%;
	float:right;
}

div#corpo {
	border: thin solid #C0C0C0;
	width: 90%;
	margin:0 auto;
	background-color: #FFFF00;
}

Bene: uso MS SharePoint Designer e nella finestra che mostra il risultato del codice (WYSIWYG) gli elementi vengono visualizzati proprio come vorrei.
Se però provo a visualizzare la pagina con IE8 il risultato è molto diverso.
In particolare si visualizza il div#corpo come una linea (cioè senza contenuto) e gli altri due elementi sotto fuori da quello che dovrebbe essere il loro contenitore.
Perchè succede ciò?
Grazie per la risposta.

[webdemo]

sposto in CSS

[gpalmia]

scusa la svista...

[evan75]

ho copiato e incollato il tuo codice e testato su ie8 senza fare nessuna modifica..
funziona. semmai dovrebbe essere il contrario: sul software wysiwyg non dovresti riuscire a visualizzare correttamente la pagina..

comunque, se provi ad inserire un'altezza espressa in px es. height:100px;

dovresti avere risolto i problemi.

ciao

-I.

[mucu]

Originariamente inviato da gpalmia
Ho un piccolo problema che non riesco a risolvere.
vorrei semplicemente inserire due elementi div all'interno di un altro che faccia da contenitore così...

potresti dare un overflow: hidden al tuo contenitore
potrsti usare un footer con clear:both
oppure aggiungere una classe come suggerito nel seguente articolo
http://perishablepress.com/press/200...clearfix-hack/

[gpalmia]

Grazie molte ad evan75 ed anche a mucu.
La soluzione proposta da evan75 non mi va molto bene perchè i due blocchi sono liquidi e devono prendere le dimensioni del contenuto, così come dovrebbe anche il contenitore; se fisso l'altezza del contenitore i blocchi rischiano di fuoriscire o di essere troppo piccoli rispetto al contenitore.
Le due soluzioni di mucu, invece vanno entrambe egregiamente.
Rimane comunque forte il dubbio sul motivo del diverso comportamento tra software wysiwyg e browser oltre che tra il mio browser (IE8) e quelo di evan75.

[Pino Alette]

Carissimi,
ho due macchine WIN XP Pro con SP3 e IE8 che puntano ad un server Apache con PHP.
Tutte cose normalissime (io non so fare altro!), CSS molto semplici.
Sulla prima, viaggio molto bene, nel senso che vedo le cose come devono.
sella seconda macchina (stessa risoluzione dell schermo) la pagina è un disastro, alcuni elementi si accavallano.
Da cosa potrebbe dipendere?
javascript:void(0);

[ResianTaxidrive]

Mah, io non mi preoccuperei di come le cose si vedono con i software WYSIWYG, ci son già abbastanza problemi di compatibilià tra i browsers. Anche Dreamweaver si comporta diversamente rispetto ai browser, per cui non guardo più la parte "visuale".