我的页面上有一行并将其分成两部分,1/2 和 1/2。
一侧是图片,另一侧是文本 block 。我想垂直对齐文本 block ,使其位于图片的中间,但我无法让它工作。
我尝试为文本 block 和行提供带有 {vertical-align: middle;} 的自定义 CSS,但没有任何改变。
希望你能帮助我。
谢谢!
最佳答案
是这样的吗?
http://codepen.io/AxelCardinaels/pen/OVryrO HTML :
<div class="main">
<div class="container">
<div class="container__image">
<img class="image__img" src="http://i.imgur.com/rdXHVp7.jpg">
</div>
<div class="container__description">
<p class="description__text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis volutpat dui ac aliquam ultricies. Mauris nec dui lorem. Aenean finibus dictum erat id consectetur. Etiam auctor, libero eu tempor tincidunt, sapien mi cursus eros, quis viverra tortor neque sed lacus.
</p>
</div>
</div>
</div>
CSS:
.container{
display:table;
}
.container__description{
width:50%;
display:table-cell;
vertical-align:middle;
padding:2em;
}
关于html - Visual Composer 文本对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31743940/