我想将我的文本与 div 的中间对齐，但我似乎无法使其工作。我该怎么做？
感谢您的帮助！
<div style="height:40px;">Personal Information</div>
“个人信息”应位于顶部和底部之间的中间位置。
CSS：
myDiv
{
display:table-cell;
vertical-align:middle;
}
内联：
<div style="display:table-cell; vertical-align:middle;">Personal Information</div>
更新：
这适用于 JSFIDDLE...
div {
display:table-cell;
width: 200px;
height: 200px;
vertical-align:middle;
background: red;
}
使 line-height 成为元素的大小。但是，只有当您只有一行文本时，它才有效。
您可以使用
table-cellCSS
display: table-cell;
vertical-align: middle;
这个怎么样？
CSS：
#outer {
height: 400px;
overflow: hidden;
position: relative;
width: 100%;
}
#outer[id] {
display: table;
position: static;
}
#middle {
position: absolute;
top: 50%;
width: 100%;
text-align: center;
} /* for explorer only */
#middle[id] {
display: table-cell;
vertical-align: middle;
position: static;
}
#inner {
position: relative;
top: -50%;
text-align: center;
} /* for explorer only */
#inner {
margin-left: auto;
margin-right: auto;
}
div.greenBorder {
border: 1px solid green;
background-color: ivory;
}
HTML
<div id="outer" class="greenBorder">
<div id="middle">
<div id="inner" class="greenBorder"> center
</div>
</div>
</div>
这是高度为 40px 的情况： http://jsfiddle.net/3NjUF/5/
试试这个（黄色表示它位于 div 的中心
<html>
<body>
<div style="height:40px; background-color:yellow">
<div style="position:absolute; top:50%; display:table">Personal Information</div>
</div>
</body>
</html>
您可以使用 margin:0 auto; 的巧妙技巧将 div 内的内容对齐到中心。 在这种情况下，以下代码应该可以正常工作，
HTML：
<div style="height:40px;"><span>Personal Information</span></div>
CSS：
span
{
width: 50%;
margin: 20px auto;
text-align: center;
display:block
}
假设“vertical-center”是你的div类的名称，并且你想要居中的内容位于div内部。
这是CSS代码：
.vertical-center { display: flex; align-items: center; height: 100px; /* Adjust the height as needed */}