2

我有以下代码——它在 IE 中正确呈现（奇怪的是），但在 Chrome 或 FireFox 中却没有，请参阅：

http://jsfiddle.net/eS34U/14/

.btn_group_fill { display:table;table-layout:fixed;width:100%; }
.btn_group_fill .btn { display:table-cell;float:none; }

基本上，带有“btn_group btn_group_fill”的元素应该跨越整个宽度——它在 IE 中是这样——但不是在 chrome 或 firefox 中——显然，我缺少一些 CSS 元素（或组合）；如果有一些见识的人可以发现我的错误，我将不胜感激...

谢谢

4

1 回答 1

0

我认为这是特定于button元素的。大概浏览器对如何呈现这些内容有不同的看法。如果您将它们更改为span或div按预期呈现。

<div class="btn_group btn_group_fill">
    <div type="button" class="btn btn_primary">Group Button 1</div>
    <div type="button" class="btn btn_default">Group Button 2</div>
    <div type="button" class="btn btn_default">Group Button 3</div>
</div>

示例小提琴

此外，如果您希望“单元格”共享边框，border-collapse 属性在这里可能很有用。

border-collapse: collapse; /* is 'separate' by default */
于 2013-10-27T21:42:20.830 回答