獲得多個div居中對齊和在同一行？

所以我做了一組導航按鈕爲我Photoshop網站，我想集中的按鈕，但使用各種CSS保證金陳述或浮動語句只是集中了按鈕，但他們是在一個1×4列，而不是在同一行（有4個按鈕）。獲得多個div居中對齊和在同一行？

我網站上的旗幟，是集中我想要的按鈕在它們下面是集中式的。這裏是我的代碼：

HTML

<div id="home" class="home"> 
<img title="Home" src="images/images/home.jpg"> 
</div> 

<div id="iwb" class="iwb" align="center;"> 
<img title="IWB" src="images/images/iwb.jpg"> 
</div> 

<div id="presentations" class="presentations"> 
<img title="Presentations" src="images/images/presentations.jpg"> 
</div> 

<div id="internet" class="internet"> 
<img title="internet" src="images/images/net.jpg"> 
</div>

CSS

.home { 
display: block; 
width: 188px; 
height: 50px; 
background: url(images/images/home.jpg) bottom; 
text-indent: -99999px; 
    } 

.home:hover { 
background-position: 0 0; 
} 

.iwb { 
display: block; 
width: 188px; 
height: 50px; 
background: url(images/images/iwb.jpg) bottom; 
text-indent: -99999px; 
} 

.iwb:hover { 
background-position: 0 0; 
} 

.presentations { 
display: block; 
width: 188px; 
height: 50px; 
background: url(images/images/presentations.jpg) bottom; 
text-indent: -99999px; 
} 
.presentations:hover { 
background-position: 0 0; 
} 

.internet { 
display: block; 
width: 188px; 
height: 50px; 
background: url(images/images/net.jpg) bottom; 
text-indent: -99999px; 

} 
.internet:hover { 
background-position: 0 0; 

}

我怎樣才能讓他們可以集中而是遍及全一行直接我的頭底下？如果可能的話，我不想在標題和導航欄按鈕之間垂直放置空白。

謝謝。

來源

2012-10-21 user2052241