如何垂直居中一个div的文本，无论文本有多少行

在下面的演示中，第一个div似乎是垂直居中，但第二个div没有。如何垂直居中一个div的文本，无论文本有多少行

如何将CSS的通用类使它们都居中？换句话说，无论文本有多少行，我如何垂直居中文本的文本？

.divs { 
 
    /*position:absolute;*/ 
 
    font-size: 18px; 
 
    box-sizing: border-box; 
 
    display: inline-block; 
 
    background-color: #ffcc99; 
 
    width: 140px; 
 
    height: 80px; 
 
    padding-top: 30px; 
 
    /*padding-bottom: 30px;*/ 
 
    margin-top: 0; 
 
    float: left; 
 
    margin-left: 98.5px; 
 
    word-wrap: break-word; 
 
    vertical-align: middle; 
 
    line-height: normal; 
 
}

<div> 
 
    <div class="divs">1234567890</div> 
 
    <div class="divs">123456789</div> 
 
</div>

来源

2015-10-17 问题大王

你是什么意思？ http://jsfiddle.net/axw9ocne/ – MortenMoulder

我认为这是你仍然需要表的一个例外，然后你在表单元上设置垂直对齐属性。 – frenchie

https://css-tricks.com/vertically-center-multi-lined-text/ – MLeFevre

<div> 
<div class="divs">1234567890</div> 
<div class="divs">123456789</div> 
</div> 
<style> 
.divs{ 
    font-size: 18px; 
    box-sizing: border-box; 
    display: inline-block; 
    background-color: #ffcc99; 
    width:140px; 
    height:80px; 
    padding-top:30px; 
    /*padding-bottom: 30px;*/ 
    margin-top:0; 
    float:left; 
    margin-left: 98.5px; 
    word-wrap: break-word; 
    text-align: center; 
    line-height: normal; 
    width:inherit; 
} 
</style>

make如果你想要的文字对齐到中心在中间检查这个link

来源

2015-10-17 11:28:13 WisdmLabs

该代码通过更改div宽度将两行粘合到一行中。对于我的项目，宽度必须固定，但无论如何感谢。 –

如何垂直居中一个div的文本，无论文本有多少行

回答

相关问题