导航栏链接/项目与 CSS 大小相同

Question

这是我从css按钮生成器获得的代码，我想知道如何使它们的大小相同，而不是按钮根据文本长度进行调整。

    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #ffffff;
    padding: 10px 20px;
    background: -moz-linear-gradient(
        top,
        #42aaff 0%,
        #003366);
    background: -webkit-gradient(
        linear, left top, left bottom, 
        from(#42aaff),
        to(#003366));
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    border: 1px solid #003366;
    -moz-box-shadow:
        0px 1px 3px rgba(000,000,000,0.5),
        inset 0px 0px 1px rgba(255,255,255,0.5);
    -webkit-box-shadow:
        0px 1px 3px rgba(000,000,000,0.5),
        inset 0px 0px 1px rgba(255,255,255,0.5);
    box-shadow:
        0px 1px 3px rgba(000,000,000,0.5),
        inset 0px 0px 1px rgba(255,255,255,0.5);
    text-shadow:
        0px -1px 0px rgba(000,000,000,0.7),
        0px 1px 0px rgba(255,255,255,0.3);
}

Answer 1

只需根据最大内容为它们提供固定宽度即可。

Answer 2

您可以使用固定的px或百分比来执行此操作。但是诀窍是然后做文本对齐：中心，我也会把它们扔到一个列表中：

http://codepen.io/anon/pen/CfjcG

Answer 3

好吧...你需要用它做一个元素，该代码只是给你在按钮创建器上设计的任何内容所需的效果，你需要把它应用到一个具有特定大小的元素。例如

.buttons{
    width:60px;
    height:30px;
    float:left;
    (all the button stuff)
}

如果你想要一个不同的大小，只需改变宽度和高度的值......这应该做到..让我知道它是否有效..:)