我一直在绞尽脑汁使用下面的方法在css中创建垂直对齐
.base{
background-color:green;
width:200px;
height:200px;
overflow:auto;
position:relative;
}
.vert-align{
padding-top:50%;
height:50%;
}<!-- and used the following div structure. -->
<div class="base">
<div class="vert-align">
Content Here
</div>
</div>虽然这似乎适用于本例，但当我增加或减少基本div的宽度时，垂直对齐会断裂，这让我感到惊讶.我希望当我设置padding top属性时，它会将padding作为父容器高度的一个百分比，在我们的例子中，这是基础，但上面50%的值是作为宽度的一个百分比计算的:(
有没有一种方法可以在不使用JavaScript的情况下，将填充和/或边距设置为高度的百分比？