Html 全屏包装内垂直居中的可变高度div

包装是1170px宽-可变/全屏高度 虽然我在JSFIDLE中指定了px，但子div的高度是%width-variable

我使用了tableparent/table cellchild方法，但这不起作用。 Margin 0 Auto似乎也没有任何作用-我不确定它是否与子divs的相对位置属性有关

---

如果有任何提示，我将不胜感激

试试flexbox怎么样？要使内容居中，请使用以下命令：

.wrap { background: grey; margin-left: auto; margin-right: auto; width: 1170px; min-height: 100vh; text-align: left; display: flex; justify-content: center; align-items: center;} 

您还可以在.wrap处使用填充，使您的孩子位于其父对象的中心

比如说

填充：40VH0

.wrap { background: grey; margin-left: auto; margin-right: auto; width: 1170px; min-height: 100vh; text-align: left; display: flex; justify-content: center; align-items: center;}