关于div的布局inline-block问题

我想在div(id=main)中将两个div并列显示，我用了inline-block，然后设置width为50%，但是效果确实两个div在父容器的一侧占据父容器的50%，为什么啊？

border一样占空间，把border去掉就好

同 如同看不见的回答。border也是占有位置滴。清掉就好啦

可以给#leftChild,#rightChild均添加一个左浮动:
#leftChild,#rightChild{
float:left;
}

不加浮动，F12调试一下两个Child的宽度，调到小于50%后可以发现它们能位于一排，
但是中间间距有一段追踪不到的空白距离，既不是padding也不是margin,可能是inline-block导致的吧。

希望能帮到你~

两个元素之间有空白字符，请将父元素的字体大小设为0即可，也可以将子元素的vertical-align:middle;
还有，你给父元素设置white-space:nowrap;子元素就不会换行了