顯示：inline-block的和定心

Question

#words { width: 600px; height: 450px; overflow-x: hidden; overflow-y: auto; border: 1px solid black; } 
#words li { display: inline-block; width: auto; padding: 10px; height: auto; background-color: #c4c4c4; margin: 2px; text-align: center; } 

所以這是我的標誌，我的CSS代碼：

<ul id="words"> 
    <li>blah</li> 
    <li>blah</li> 
    <li>blah</li> 
    <li>blah</li> 
    <li>blah</li> 
    <li>blah</li> 
    <li>blah</li> 
    <li>blah</li> 
    <li>blah</li> 
</ul> 

但是，我似乎無法對<li>width:auto;沒有浮動他們離開（在FireFox ）。

任何想法？

Answer 1

沒關係，我整理了它。

#words現在有text-align: center;

Answer 2

如果你想讓它疊起來垂直（據我所知），那麼你只需要從words li選擇刪除「inline-」：

#words li 
{ 
    display: block; 
... 
} 

Example here。