为什么多个行内元素换行后出现上边距?

Question

用js做一个5*5的表格,在设置css时发现这种情况:当小div设置成display:inline-block时，效果如图：

每行中间都有小间距，这是为什么？
换成浮动float：left却不会

Answer 1

感觉又是一个inline-block的日经问题。。

虽然js生成是中间没有空白的文字节点，但是inline-block的元素换行后还是会有间隙出现。

可以通过父元素上添加font-size:0解决。

补充：
https://jsfiddle.net/6gnv54cq/

@CRIMX

Answer 2

楼上，如果是空白字符问题的话，间隙应该出现在横向的。

竖向的间隙应该是 vertical-align 的问题，设置为 bottom 试试，没有提供代码给不了确切答案。

Answer 3

display: inline-block;的元素
垂直方向 默认基线对齐（主要考虑英文如j/y/g等类似的字符最下端具体显示的情况）