Question

所以我有div这样的样式选项：

div.Holder {
height: 45px;
line-height: 45px;
text-align: center;
border-top: 3px #E7E7E7 solid;
color: #535353;
}

在那个div里面有这样的选择：

.Holder > span { display: inline-block;
vertical-align: middle;
line-height: 15px;
font-size: 13px;
font-weight: bold;
}

所以文字插入

<div class="Holder"><span> here </span></div>

应垂直和水平居中，并且在文档中

'<!DOCTYPE html>'，

但是当我将这些元素插入

时

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

页面文本只是转到div的顶部。

除非我从span元素中删除line-height属性，但是如果有多行文本 - 第二行不可见，因为文本使用line-height: 45px.

我该如何处理这个问题？

Answer 1

此代码无效，请尝试使用此类代码

div.Holder {
    display: block;
    height: 45px;
    margin: 0 auto;
}

div.Holder > span {
    display: table;
    height: 15px;
    margin: 0 auto;
    padding: 15px 0;
    top: 50%;
}

例如：的 JSFIDDLE DEMO

并始终使用css reset

垂直对齐线高不能正常工作

1 个答案: