https://jsfiddle.net/93hjyhs8/
我试图将文本垂直居中于右侧,但很难找到适用于所有浏览器的纯CSS解决方案。
.block元素的高度应该是动态的,并扩展到最高的子元素(当前.thing1)的大小。
请注意,如果可能的话,我宁愿避免使用表格等黑客攻击,也可以随意发布这些解决方案。
另外,为什么元素不仅在底部而且还略微轻推下来?
.block {
width: 500px;
background: yellow;
}
.thing1 {
height: 100px;
width: 40%;
background: blue;
display: inline-block;
}
.thing2 {
background: red;
width: 60%;
vertical-align: top;
display: inline-block;
}

<div class='block'>
<span class='thing1'></span><span class='thing2'>Hello world how are you today r u alrite m8 i think u r weak m8</span>
</div>
&#13;
答案 0 :(得分:1)
演示 - https://jsfiddle.net/victor_007/93hjyhs8/1/
为vertical-align:middle
元素添加inline-block
答案 1 :(得分:0)
你可以使用新的强大的CSS flexbox ,
.block {
width: 500px;
background: yellow;
display: flex;
align-items: center;
justify-content: center;
}