html - 尽管内容长度不同，但 jQueryUI 按钮的大小相同

Question

我试图使用ButtonfromjQueryUI并想知道如何使按钮显示为相同大小（最好在屏幕上居中）。按钮的大小似乎会根据文本增大/缩小。我想知道如何将所有按钮的大小固定为（比如说）具有最长文本的按钮。

如果有人想下载并试用它，我在 github 上有我的代码（抱歉，我无法在 jsfiddle 上分享它，因为很难让它与多个文件/依赖项一起工作；我试过了）。另外，如果您想快速浏览一下，它也在这里。

我的目标是使这些按钮居中并使它们都具有相同的大小。

我是一名初学者，一般学习 javascript、CSS、HTML 和 Web 开发。如果有人可以帮助我解释/弄清楚如何实现这一目标，我将非常感谢您的帮助。非常感谢。

score 2 · Accepted Answer

您可以使用以下代码从具有最长文本的按钮中获取最大宽度：

var maxWidth = Math.max.apply(null, $(".ui-button").map(function () {
    return $(this).outerWidth(true);
}).get());

注意我正在使用选择器$(".ui-button")，因为所有jQuery UI按钮都有这个 CSS 类。然后应用maxWidth到所有按钮：

$(".ui-button").css({"width" : maxWidth});

这是一个有效的 JS Bin 演示：http: //jsbin.com/ihuquq/1/edit

1 回答 1