margin-top di un div interno ad un altro

[dabadort]

Ho una pagina con un container dentro cui è contenuto un header... se io volessi dare il margin-top all'header mi scende giu tutto il container, perchè? ho visto una soluzione con i float... non c'è nessun altro modo?

posto il codice css:

body {
background-color: #F2EFF0;
}
#contenitore {
width: 950px;
margin: 0 auto;
height: 900px;
background-color: #214b93;
}
#header {
background-color: #179594;
width: 900px;
height: 200px;
margin: 0 auto;
margin-top: 10px;
}

grazie!!!!

[dabadort]

il margin-top riesco a darlo se inserisco il padding... anche un solo px...
es:

body {
background-color: #F2EFF0;
}
#contenitore {
width: 950px;
margin: 0 auto;
height: 900px;
background-color: #214b93;
padding: 1px;
}
#header {
background-color: #179594;
width: 900px;
height: 200px;
margin: 0 auto;
margin-top: 20px;
}

in questo modo riesco a scendere con l'header tramite margin top senza che scenda automaticamente anche il contenitore... Non so se una buona soluzione perchè mi sfugge il perchè...
Consigli??? thanks

[ResianTaxidrive]

non ho mai ben capito neanche io questa cosa, solitamente comunque risolvo assegnando al #contenitore un padding-top:20px anzichè dare a #header un margin-top:20px;

[dabadort]

anche io ho risolto alla stessa maniera... però ci deve essere il metodo usando direttamente i margini... facendo float: left poi il margin lo prende ma come soluzione non è un granchè...

[dabadort]

un altro modo per dare questo benedetto margine può essere quello d inserire prima dell'header un altro div a cui dare l'altezza del margine... opinioni????

[fcaldera]

il motivo per cui succede è dovuto al collassamento dei margini, definito nelle specifiche dei css2: http://www.w3.org/TR/CSS2/box.html#collapsing-margins

[dabadort]

illuminante... grazie mille!!!!!