以CSS轉換或Flexbox爲中心哪一個更好？爲更好地支持

與CSS變換爲中心這樣以CSS轉換或Flexbox爲中心哪一個更好？爲更好地支持

position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%);

VS 與Flexbox的定心這樣

display: flex; 
    align-items: center; 
    justify-content: center;

哪一個，哪一個更好，最好？

來源

2017-04-24 Jay

CSS轉換有更好的支持，關於哪一個，flexbox流動得更好，仍然依賴於這麼多事情......並且也主要是基於意見的 – LGSon

蘋果和桔子。 'absolute'從頁面流中移除一個元素，而flex不會這樣做。這可能會或可能不適合你。 'transform'具有比'flex'更好的瀏覽器支持，但flex得到了廣泛的支持（目前約有97％的瀏覽器支持）。根據您的要求使用任何一種。 –

@MichaelCoker謝謝你，你應該把它當作答案。 – Jay

蘋果和橘子。 absolute從頁面流中刪除元素，並且flex不會這樣做。這可能會或可能不適合你。 transform比flex有更好的瀏覽器支持，但flex得到了廣泛的支持（目前約97％的瀏覽器支持）。瀏覽器支持是我使用absolute和transform而不是flex的唯一原因。

您也可以使用display: table-cell; text-align: center; vertical-align: middle;並做同樣的事情，它比以前的任何一種技術都有更好的支持。 http://caniuse.com/#feat=css-table

使用無論哪一個適合您的要求。

來源

2017-04-24 21:39:38

我自己使用flexbox。定心只是它能做的第一件好事。有關更多選項，請參閱W3Schools：反轉，換行，間距等。要驗證對任何CSS的支持，caniuse.com是一個很好的資源。

來源

2017-04-24 18:31:05

以CSS轉換或Flexbox爲中心哪一個更好？爲更好地支持

回答

相關問題