消息关闭
    暂无新消息!

问题如下所示:

div中嵌套的section样式:

  .padding-right {
    display: inline-block;
    padding-right : 20px;
    width: 50%;
    box-sizing: border-box;
    vertical-align: middle;
  }
  .padding-left {
    display: inline-block;
    padding-left: 20px;
    width: 50%;
    box-sizing: border-box;
    vertical-align: middle;
  }

这样写如上图所示,safe即第二块section就会被挤下去,width改小写比如49.5%就可以了,但是整体宽度就会变成99%,最右边会出现与上下块不对齐的现象。

有没有办法让两个scetion回到同一行上并且不会出现width变短导致的不对齐的问题?


6个回答

︿ 1

补充楼上的,
在有些浏览器下,inline-block,会多出几个像素的间距

︿ 0

2 个元素之间有一个空白字符,空白字符也占用宽度的,可以把 div 的字体大小设置为 0 然这个空白字符不占据宽度。

︿ 0
padding-right : 20px;
padding-left: 20px;

widthbordermarginpadding,四項相加之和才是所佔寬度。