前端CSS布局，两个div 为inline-block, 在一个内部添加p会影响另外一个的布局原因？

Question

就是左右两个div是display:inline-block; 但是当我往第一个div中插入块级标签时，右边的div自动往下移动，这是为什么呢？先谢过各位大佬了

Answer 1

加overflow:hidden试试

http://blog.csdn.net/qq_27545151/article/details/48598397

Answer 2

这些的话 怎么说都不好使 你直接开f12开发找到左上角的小鼠标 一个个放到元素上去看他们具体是怎么放的

Answer 3

也不知到原因，之前用的时候也会出现这种情况，如果两个高度一样的话，在外面价格div高度和它一样就能解决，不一样的话还是用浮动吧

Answer 4

设置成行内元素 里面又加块级元素

Answer 5

建议你用浮动

 <div style="width: 100%;overflow: hidden;">
            <div style="width: 50%;height: 200px;background: yellow;float: left;text-align: center;">
                <p>helloworld</p>
            </div>
            <div style="width: 50%;height: 200px;background: chartreuse;float: right;text-align: center;">
                <p>helloworld</p>
            </div>
  </div>

Answer 6

是因为baseline的原因 看左边最下面的文字和右边文字是对齐的

必须拜读张鑫旭的文章了

CSS深入理解vertical-align和line-height的基友关系 " 张鑫旭-鑫空间-鑫生活
http://www.zhangxinxu.com/wordpress/2015/08/css-deep-understand-vertical-align-and-line-height/

Answer 7

非常感谢各位大佬的指导，谢谢各位