顯示錶格單元格不一致。

的按鈕不填充容器尚錨做。兩種標籤在風格上有什麼根本不同？

<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

顯示錶格單元格不一致。

回答

相關問題