html - Visual Composer 文本对齐

标签 html css wordpress

我的页面上有一行并将其分成两部分,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/

相关文章:

html - 更改导航栏中列表项的文本颜色

html - 如何让一张图片覆盖整个屏幕

css - 将多个 Div 保持在一个容器的中心。页脚也卡在中间

jquery - 高度问题

html - 创建三个div,使顶部和底部的高度固定,中间的高度动态?

wordpress - 将类添加到 wp_nav_menu 中的 li 元素

html - CSS 左侧固定,右侧流动,在固定宽度内居中

html - 如何限制内联显示的子 div 的数量?

Javascript 在页面重新加载时运行

php - 帖子的 WordPress 术语列表