當我在頁面頂部添加聲明時,我的flexbox佈局會崩潰,當我刪除doctype時,它會按預期工作。問題發生在chrome/firefox/ie中。Doctype中斷flexbox佈局
.grid {
height: 100%;
display: flex;
flex-flow: column nowrap;
flex-grow: 1;
border: 1px solid black;
}
.row {
width: 100%;
display: flex;
flex-flow: row nowrap;
flex-grow: 1;
}
.cell {
flex-grow: 1;
border: 1px solid black;
}
<div class="grid">
<div class="row">
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
</div>
<div class="row">
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
<div class="cell"></div>
</div>
</div>
https://plnkr.co/edit/jKklf2zeYBjOgTsSQnvr
它應該是什麼樣子:
如何還有人編寫HTML代碼沒有默認文檔類型?文檔類型不只是您可以隨心所欲添加或刪除的內容。它應該在那裏,*期*。有一個文檔類型不會「破壞」任何東西 - 刪除它。 – BoltClock
@BoltClock我不認爲有人說這是一個默認的編碼風格的東西,所以請不要像有人踏上你的腳趾。 – Jesse