[Html, CSS] Wyśrodkowanie div'ów

Jak się wysrodkowuje 2 divy ? bo przy jednym robiłem to tak:

	margin: 0px auto;
	

a przy dwóch już nie wiem jak to zrobić.

Mam takie coś:

css:

#aaa{
	
	width: 142px;
	height: 27px;
	background: url(pics/aaa.png);
	margin: 0px auto;
	float:left;
	
	}

#bbb{
	width: 348px;
	height: 27px;
	background: url(pics/bbb.png);
	margin: 0px auto;
	}

html:

<div id=aaa></div>
<div id=bbb></div>

I wychodzi, że div (aaa) jest po lewej a div (bbb) po środku, a jak nie mam tego float:left; w div(aaa) to div(aaa) jest nad div'em (bbb)

zapakuj te dwa divy w diva i tego jednego wypośrodkuj

mam tak:
CSS

#folio{
	
	width: 142px;
	height: 27px;
	background: url(pics/folio.png);
	float:left;
	
	}

#obokfolio{
	width: 348px;
	height: 27px;
	background: url(pics/obokfolio.png);
	margin: 0px auto;
	
	
	}

#tag{
margin: 0px auto;
	}

Html:

<div id=tag>
<div id=folio></div>
<div id=obokfolio></div>
</div>

i tak nie gra.

z obokfolio wyrzuć margin, do tag musisz dodać szerokość sumy tych divów (inaczej przyjmuje szerokość 100% i jego wyśrodkowanie nic nie robi)