Html Doctype打破了flexbox布局

当我在页面顶部添加声明时，我的flexbox布局将崩溃，当我删除doctype时，它将按预期工作。chrome/firefox/ie出现问题

.grid{
身高：100%；
显示器：flex；
柔性流动：柱状nowrap；
柔性生长：1；
边框：1px纯黑；
}
.行{
宽度：100%；
显示器：flex；
flex-flow：行nowrap；
柔性生长：1；
}
.细胞{
柔性生长：1；
边框：1px纯黑；
}

---

包括doctype并将其添加到CSS中：

html, body { height: 100%; }

使用百分比高度时，必须为根元素之前（包括根元素）的所有父元素指定高度。请在此处阅读更多信息：

删除doctype时，浏览器将进入“怪癖”模式，并在父元素的高度为

auto

时解析元素相对于视口的百分比高度。请在此处阅读更多信息：

---

我真的试过了，但我肯定错过了什么，但它现在起作用了，所以谢谢：）为什么它会这样起作用@Nathangings，答案中的链接给出了解释。