讓列並排

好吧，所以我正在爲個人使用做一個小布局，我想要5列並排。到目前爲止，我有以下幾點：讓列並排

<center> 

<!DOCTYPE html> 
<html> 
<body> 

<body style="background-color:#B0B0B0;"> 

</body> 
</html> 



<br><br> 

<!DOCTYPE html> 
<html> 
<body> 

<div style="font-family:verdana;padding:25px;border-radius:70px;border:8px solid black; width:800px; background-color:#D8D8D8;"> 

<iframe src="http://free.timeanddate.com/clock/i3nhi1p2/n889/fn17/fs20/tc777/ftb/bo2" frameborder="0" width="146" height="29"></iframe> 

<br><br><br> 


<style> 

#columns { 
    width: 250px; 
} 

#columns .column { 
    position: relative; 
    width: 46%; 
    padding: 1%; 
    border: solid 1px #000; 
} 

#columns .center { 
    float: center; 
} 

</style> 

<div id="columns"> 
<div class="center column"> 
TEXT GOES HERE 
</div> 
<div class="center column"> 
TEXT GOES HERE 
</div> 
<div id="columns"> 
<div class="center column"> 
TEXT GOES HERE 
</div> 
<div id="columns"> 
<div class="center column"> 
TEXT GOES HERE 
</div> 
<div id="columns"> 
<div class="center column"> 
TEXT GOES HERE 
</div> 
</div> 
<br><br> 

</center> 
</body> 
</html> 


</div> 

</body> 
</html> 

</center>

問題是列堆疊在彼此的頂部，而不是並排，任何人都可以幫助我嗎？謝謝。

來源

2013-05-30 Coding77

將列懸浮！

#columns .float { 
    position: relative; 
    width: 46%; 
    padding: 1%; 
    border: solid 1px #000; 
}

來源

2013-05-30 23:54:47 Nochbag

那麼這樣嗎？

回答