display：css-table vs flex - 我甚至需要後者嗎？

我使用垂直中心塊元件是這樣的：display：css-table vs flex - 我甚至需要後者嗎？

.parent { 
    display: table-cell; 
    vertical-align: middle; 
    display: -webkit-box; 
    display: -ms-flexbox; 
    display: flex; 
    -webkit-box-align: center; 
    -ms-flex-align: center; 
    -ms-grid-row-align: center; 
    align-items: center; 
}

當我需要IE9和下部支撐。當然，使用css-tables作爲較老的IE-s的後備。我不需要flex來做其他事情。但最近我開始問自己：爲什麼我甚至需要在這裏彎曲？ Css-table是一個強大的解決方案，幾乎可以在這個星球上的每一個瀏覽器上支持，並且根據this Ben Frain's article它更快。這裏不是css-table嗎？當問人們關於這個問題時，我得到了像「flex更現代」等答案。這很好，我明白，有些東西只能用於flex，但這不是真正的答案。我們正在討論最簡單的對中塊元素。

所以我有兩個問題：

我要在這樣的情況下使用柔性？
如果「是」 - 爲什麼？

來源

2016-05-23 user2696785

通常情況下，沒有單一的解決方案來解決問題，所以試着堅持一種你喜歡的方法，並且不要把你不完全理解的東西複雜化爲最常見的東西，它會是你將不得不審查代碼並在將來進行更改.. –

查看[此文章]（http://kyusuf.com/post/almost-complete-guide-to-flexbox-without-flexbox），其中顯示了一些用例在哪裏可以使用CSS表格而不是flexbox – Danield

我們從使用HTML中的表格作爲佈局工具的原因是有原因的。

這不是語義。當我們想到一個表格時，我們會考慮數據的表示。 MDN解釋得很好。

在創建CSS之前，HTML元素通常被用作頁面佈局的一種方法。自HTML 4以來，該用法一直不鼓勵，並且該元素不應用於佈局目的。但是，HTML電子郵件是一個例外，其中表格仍然通常用於佈局目的。原因是受歡迎的電子郵件客戶端的CSS支持不佳。

所以，除非你正在設計電子郵件佈局，不要使用表格元素或css表格屬性進行佈局。

如果你需要像你的例子中的回退黑客，但仍然可以使用它，但除了使用現代合適的方法，無論是網格，彎曲，浮動或其他。

來源

2016-05-23 06:10:39 Paran0a

但是我沒有在這裏談論** HTML-tabels ** - 這是完全不同的事情。 ** CSS表格**只是強制非表格元素表現得像表格元素一樣。這不就是CSS的意思嗎？畢竟，CSS是一種造型語言。「 – user2696785

」CSS表格只是強制非表格元素表現得像表格元素一樣。「那是這個問題。他們是桌子嗎？沒有？然後不要給他們表的屬性。一個有問題的場景：如果我和你一起工作並且在你的CSS中看到你有一些像.container {display：table}這樣的規則，我會認爲那個容器是一個表。但是如果有像.container {display：flex}這樣的東西，我就知道那個容器正在幫你佈置東西。 – Paran0a

多麼荒謬的說法：「不要給他們表屬性。」如果某種風格的東西能夠實現特定的設計，如果它仍然使用語義標記並且在視覺上行爲良好，那麼它幾乎完全不相關。什麼時候「display：table' * not * for layout？迂腐的廢話。 – Walf

display：css-table vs flex - 我甚至需要後者嗎？

回答

相關問題