Chiarimento float CSS

Sto iniziando a studiare i CSS e per fare esperimenti ho creato un body con dentro due colonne laterali equidistanti dai lati sinistro e destro della pagina.
Le colonne le ho posizionate con le regole float: left; e float: right;
Quindi tutto quello che metto dopo queste colonne dovrebbe essere "risucchiato" e posizionato in mezzo, giusto?
E infatti così avviene, ho inserito un paragrafo e si posiziona tra le 2 colonne.

Ma se applico uno sfondo e un bordo a questo paragrafo, perché vanno ad occupare anche la parte delle 2 colonne?
Sfondo e bordo non dovrebbero comportarsi come il testo? Ossia posizionarsi tra le 2 colonne?

Questo è il link del mio file di test:

Anche se potete benissimo visualizzare il sorgente, vi incollo direttamente qui le regole css:

<style type="text/css">
body { padding: 10%;
 border: solid 2px blue; }
.colonnaS {
 width: 15%; float: left; border: solid 2px red;
 margin: 10px; padding: 5px;
}
.colonnaD {
 width: 15%; float: right; border: solid 2px red;
 margin: 10px; padding: 5px;
}
.paragrafo {
 border: solid 2px red; background-color: yellow;
}
</style>

[javascripter]

Pare che tu abbia problemi con il "box model" (una ricerca su google può aiutarti) che assume comportamenti diversi a seconda del browser.

Ahimé, il css non è il mio forte e non posso darti un grande aiuto.

Semplicissimo

devi mettere al class paragrafo l'overflow auto

esempio:

.paragrafo {
 border: solid 2px red; background-color: yellow;
 overflow:auto;
}

Così si regola automaticamente.. Grazie :)
Sono davvero belli questi CSS!

Se li sai usare fai veramente delle belle cose senza troppo sforzo;

per quanto mi riguarda non sono difficili, e sono anche semplici da imparare.

Si si infatti già ho creato il mio primo tema grafico, fatto tutto da me, è un piacere impararli. :D Fin'ora ho studiato i css2, prima di passare a css3 voglio fare altri esperimenti per capire bene tutti i dettagli.

Alla fine anche io ho imparato sperimentando.

Si è la migliore strada per imparare.

- sperimentare
- guide
- video tutorial (da non sottovalutare)
- forum

Io ad esempio mi sono seguito anche queste video lezioni http://www.youtube.com/playlist?list=PLD74C5E763D39793D che consiglio ai principianti come me

Prova con questo w3school, penso che ti sarà di grande aiuto.

Buon lavoro.

Prova con questo w3school, penso che ti sarà di grande aiuto.

Buon lavoro.

Ottimo! Grazie ;)