文字不会垂直居中？
文字不会垂直居中？
提问于 2014-09-30 23:10:18
我一直试图让文本垂直中心像这个http://i.imgur.com/Vb7NuTV.png，但它似乎不想对齐。
@import url('http://getbootstrap.com/dist/css/bootstrap.min.css');
h4 {
margin-top: 25px;
}
.row {
margin-bottom: 20px;
}
.row .row {
margin-top: 10px;
margin-bottom: 0;
}
[class*="col-"] {
padding-top: 15px;
padding-bottom: 15px;
background-color: #eee;
background-color: rgba(86, 61, 124, .15);
border: 1px solid #ddd;
border: 1px solid rgba(86, 61, 124, .2);
height: 250px;
}
hr {
margin-top: 40px;
margin-bottom: 40px;
}
.innertext {
display: inline-block;
width: 90%
}
.label {
position: absolute;
top: 50%;
margin-top: -10px;
}<div class="container">
<div class="row">
<div class="col-md-4">
<div class="innertext">Text Test Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text</div>
</div>
</div>
</div>
Jsfiddle：http://jsfiddle.net/r0gsewtd/1/
Stack Overflow用户
发布于 2014-09-30 23:19:08
[class*="col-"] {
padding-top: 15px;
padding-bottom: 15px;
background-color: #eee;
background-color: rgba(86, 61, 124, .15);
border: 1px solid #ddd;
border: 1px solid rgba(86, 61, 124, .2);
height: 250px;
display: table-cell;
vertical-align: middle;
}将最后2行添加到[class*="col-"]中
display: table-cell;
vertical-align: middle;您还可以检查以下内容：如何使用CSS垂直对文本进行居中？
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/26131663
复制相关文章
相似问题
腾讯云开发者
