显示表格单元格不一致。

的按钮不填充容器尚锚做。两种标签在风格上有什么根本不同？

<div class="table"> 
    <a href="#">A</a> 
    <a href="#">B</a> 
    <a href="#">C</a> 
</div> 

<div class="table"> 
    <button href="#">A</button> 
    <button href="#">B</button> 
    <button href="#">C</button> 
</div> 


.table { 
    display: table; 
    width: 100%; 
    outline: 1px solid red; 
} 

.table > * { 
    display: table-cell; 
    outline: 1px solid lightgreen; 
}

来源

2013-05-08 Jeffpowrs

我想不出来:)我也好奇！ – Jondlm 2013-05-08 22:01:23

更有趣的是：http://jsfiddle.net/dSVGF/2/ :) – Passerby 2013-05-09 04:10:25

@Passerby，规则“.table> *”只适用于直接的孩子，所以理论上，div（但不是它的嵌套按钮A），按钮B和跨度（再次，不是它的嵌套按钮）应该适用于此规则。由于按钮标签在某些浏览器上不允许显示“表格单元格”，因此按钮“B”在此处不在循环中。 – BDawg 2013-07-08 08:28:56

我想这些元素之间的根本区别是，<button>被视为替换元素（至少由某些浏览器），并在非CSS浏览器内置机制的帮助下呈现。 Bugzilla中有几个关于由此造成的按钮渲染限制的问题（例如https://bugzilla.mozilla.org/show_bug.cgi?id=733914）。

IE9 +和Opera似乎并没有将<button>视为替换元素，根据最新的HTML spec，它似乎更加正确，但在CSS中仍然相当不清楚。

来源

2013-07-08 09:04:26

-2

按钮是一个可点击的元素，它允许你把内，任何文字，图像等

一个锚标记是具体的超链接。

来源：w3schools.com

来源

2013-05-13 20:10:22

-1使用完全不可靠的W3学校。 – Sparky 2013-05-13 20:20:20

我认为这是一个比html问题更多的CSS问题。可能在浏览器样式表中，但检查器中没有任何属性似乎对此有任何影响。 – Jeffpowrs 2013-05-14 13:54:54

的按钮标签实际上是否接受“显示：表单元格”是依赖于浏览器，显然。我对Chrome开发人员工具进行了快速检查：在计算出的样式中，按钮上的显示设置为内嵌块。当我在IE10中尝试相同时，它接受了实际改变尺寸的表格单元格的变化和按钮。

来源

2013-07-08 08:23:48 BDawg

显示表格单元格不一致。

回答

相关问题