Html 忽略“垂直对齐中间”特性显示表格和表格单元格

我似乎无法理解为什么浏览器会忽略

display:table

和

table cell

，

vertical align:middle

属性。这对我来说似乎很直接，但我的结果与我告诉我的

div

s使用CSS所做的完全不同。以下是问题的快照：

如何使框显示在页面的正中间

html，
身体{
保证金：0；
填充：0；
}
#容器{
宽度：100%；
显示：表格；
身高：100%；
}
#包装纸{
边框：1px实心rgb（112112112）；
显示：表格单元格；
垂直对齐：中间对齐；
背景：红色；
}

箱

您需要将

高度：100%

设置为

html，body

，否则

#容器将
高度：100%
为零


html，
身体{
保证金：0；
填充：0；
身高：100%
}
#容器{
宽度：100%；
显示：表格；
身高：100%；
}
#包装纸{
边框：1px实心rgb（112112112）；
显示：表格单元格；
垂直对齐：中间对齐；
背景：红色；
}

箱