首页 > 其他 > 详细

设置两个DIV为display:inline-block出现上下错位问题

时间:2017-10-24 10:45:59      阅读:346      评论:0      收藏:0      [点我收藏+]

今天在布局时,发现AB两个div设置display:inline-block,出现上下错位问题,当AB里面内容为空时,错位问题消失

看了网上资料以及通过实践分析,总结如下

1.同一行的行内元素对齐方式默认是底部对齐,即vertical-align:baseline

2.对于内容为空的inline-block元素而言,该元素的基线就是它的margin底边缘,否则就是元素的内部最后一行内联元素的基线

解决方式:

1.float方式(考虑脱离流后后面元素不易控制,故不首选)

2.改变vertical-align属性

 

 

技术分享

 

http://www.cnblogs.com/jiangzilong/p/6145157.html

设置两个DIV为display:inline-block出现上下错位问题

原文:http://www.cnblogs.com/zml-mary/p/7722061.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!