如何使按钮大小相同

Question

我正在尝试获得大小相同的按钮，但是我是新手，因此卡住了，这是我的CSS代码：

.bannerArea nav ul li{
    list-style:none;    
    display:inline;
    padding: 10px 30px;
    background-color:#0C0C0C;
    opacity:0.7;
    text-align:center;
    text-shadow:none;
}

http://www.webpagetemplates.org/web-page-templates/download/preview/wpt0054/ 注意按钮？它们都是我想要的相同尺寸。而且，我如何将实际按钮居中而不仅仅是文本？

Answer 1

最重要提示：将测试用例放入JSFiddle可以让人们更清楚地了解您的问题，从而为您提供答案。

话虽如此，您想使用display: block代替inline，然后设置宽度：

.bannerArea nav ul li{
    list-style:none;    
    display:block;
    width: 25%; /* Adjust this accodringly */
    padding: 10px 30px;
    background-color:#0C0C0C;
    opacity:0.7;
    text-align:center;
    text-shadow:none;

}