码迷,mamicode.com
首页 > Web开发 > 详细

css table-cell

时间:2016-09-01 22:50:29      阅读:285      评论:0      收藏:0      [点我收藏+]

标签:

今天遇到一个样式:图文两列排列。

由于图片大小固定,于是就想到了用table-cell实现。

<div class="container">
  <div class="box"><img src="demo.png" /></div>
  <div class="box">
    <p>今天是周四</p>
    <p>今天是9月伊始</p>
    <p>今天是2016年的下半年</p>
  </div>
</div>

最初css代码如下:

.container{display:table;}
.box{display:table-cell}

但是如果只是简单的这样写,你会发现图片和问题不在同一个水平线上。

 

css table-cell

标签:

原文地址:http://www.cnblogs.com/perallina/p/5831596.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!