0

我有一个按钮渲染问题。我处于 IE9 怪癖模式。它是 html 框架（不是 iframe）中的遗留代码，目前我对 quirks 模式别无选择。我已经去掉了所有的 css 和 javascript，所以我相信我只能使用默认的 IE9 渲染。

问题是这样的：按钮文本左右的填充似乎与文本的长度成正比。也就是说，文本越长，填充越宽。客户坚持要求某些按钮最多包含 20 个字符的文本，并且这些按钮在按钮内文本左右两侧的大量死区中构建（即，可以说是 padding-left 和 padding-right），以至于布局严重损坏。

由于按钮文本从 7 到 20 个字符不等，我也不能轻易地做固定宽度的按钮。我想要完成的是固定的 padding-left 和 padding-right。我能想到的最好的方法是 ems 中的内联宽度，例如，

<input value="The Big Whateverest" type="button" style="width:11em;">

我尝试使用内联样式填充/边距，但这只会让事情变得更糟。有什么建议么？

编辑：根据解决方案，部分难题是按钮位于表格单元格内。如果您在这里是因为您需要知道这一点，请务必点击 Adam 解决方案中的链接以了解完整问题。

4

1 回答 1

1

您可以通过更改为来调整此解决方案以适应您的情况，如下所示：.buttoninput

<style>
input {
    padding: 0 .25em;
    width: auto;
    overflow:visible;
}
</style>

<!--[if IE]>
<style>
input {
    width: 0;
}
</style>
<![endif]-->
于 2013-01-12T02:40:19.747 回答