block 元素 对半分时的问题

今天想把一个p 对半分成两半的时候，使用下面的代码：

   a
   b


.cell span{
  display:inline-block;
  width:50%;
}

发现两个span并不是正好水平对齐，而是每个span单独占用了一行。

当我把代码调整成下面的时候：

     ab

这个两个span正好各占50%，且在同一行上。

在网上搜索了下原因：

原来是当使用inline-block 的时候，如果两个inline-block元素之间有一个新行，那么在它们之间就会有一个空格。那么50% + 50% + space > 100%; 第二个inline-block就放不下了。

解决办法也有很多种：
1.不换行

ab

还是不换行

3.通过注释换行

当然还有其他解决办法。