Salve a tutti, ho ripreso ad usare i css da poco e mi sono cimentato nel realizzare qualcosa di abbastanza semplice.
Tuttavia ho un piccolo problema con i margini, ho provaro a cercare ma non ho trovato risposte alla mia domanda.

vi posto il codice di prova

codice:
<body>
	<div id="top_bar">
    	<div id="menu">questa è la barra menu</div>
    </div>
    
	<div id="container">
    	contenuto
    </div>
    
</body>
codice:
body{
	background-color:#333;
	margin: 0px;
	padding: 0px; 
}
	
#container {
	background-color:#CCC;
	color:#333;
	height: 1200px;
	width:800px;
	margin: 7px auto;
	border: 2px solid #000;

	
}

#top_bar{
	width: auto;
	height: 40px;
	background-color:#000;
	color:#999;
	border-bottom: 1px solid #999;
}
#menu{
	width: 800px;
	height: auto;
	background:#900;
	border: 1px solid #FFF;
	margin-left: auto;         // per centrare orizzontalmente: FUNZIONA
	margin-right: auto;
	margin-top: auto;         // per centrare verticalmente: NON FUNZIONA
	margin-bottom: auto;
}
in pratica vorrei centrare il blocco div id="menu" all'interno di div id="top_bar".
grazie a margin-left: auto; e margin-right: auto; riesco a centrarlo orizzontalmente, ma non riesco invece a centrarlo verticalmente.

probabilmente è una cavolata assurda ma cosa sbaglio?
Grazie anticipatamente a chi risponderà!