修复Twitter Bootstrap中的按钮大小

Question

我在我的网络应用程序中使用Twitter Bootstrap.我有一张带有许多按钮的桌子.按钮文本随表格行的当前状态而变化.在Ajax请求响应之后,我使用Jquery更改按钮文本.

我的麻烦是,这些按钮文本的长度不固定.其中一些很长,其中一些很短.

因此,当一行有长文本而另一行有短文本时,用户的眼睛看起来很糟糕.

我可以修复按钮大小吗？所以它们都有相同的尺寸？

http://i46.tinypic.com/28726jb.jpg

Answer 1

给你想要的所有按钮大小相同,例如 class="myButton"

然后在模板的自定义CSS区域中,您可以为该类赋予宽度:

.myButton {
    width: 150px;
}

或者,如果您希望它们都具有最长按钮的宽度,您可以使用jQuery,只要.myButton按钮的值发生变化,就可以调用此代码.此代码在此解释:https://stackoverflow.com/a/5784399/1130734

$('.myButton').width(
    Math.max.apply(
        Math,
        $('.myButton').map(function(){
            return $(this).outerWidth();
        }).get()
    )
);

这是一个jsfiddle示例http://jsfiddle.net/hQCf9/