Problema con il padding

[stakkit]

Ciao a tutti!
Ho un problema con il padding che non riesco a risolvere.

Ho il seguente codice:

<div id="banners">
            <div id="banner-grande">
            </div>

            <div id="banner-piccolo">
            </div>
</div> 

I due banner stanno all'interno di un div di larghezza 960px.
Il div banner-grande ha 640px di larghezza.
Il div banner-piccolo ha 320px di larghezza.

Per i due div ho assegnato la proprietà float:left; in modo che possano stare tutti e due orizzontalmente in un unico div.

Il problema è che quando assegno la proprietà padding-left:5px; al div banner-grande , quell'altro div (banner-piccolo ) si sposta verso il basso.

Perché fa così?

[carlomarangoni]

Semplicemente perchè il padding si somma alla larghezza del div, quindi 5+320=325 pertanto non stà più nel contenitore perchè 640+325=965 che non stà nel 960.

Tutto chiaro?

[stakkit]

Originariamente inviato da carlomarangoni
Semplicemente perchè il padding si somma alla larghezza del div, quindi 5+320=325 pertanto non stà più nel contenitore perchè 640+325=965 che non stà nel 960.

Tutto chiaro?

Grazie mille! ho capito!
Ma non c'è un modo per dare dello spazio al testo che sta dentro il div?
cioè vorrei che il testo si spostasse un po da sinistra.

[Redmile]

certo, dai il padding direttamente al selettore p

oppure ridimensioni i div in base al padding

[stakkit]

Originariamente inviato da Redmile
certo, dai il padding direttamente al selettore p

oppure ridimensioni i div in base al padding

Grazie mille!

[Redmile]

figurati