行内元素的特性

  这几天，写了一个网页，出现一个奇怪的问题，正常的情况应该是这样的，

可是偏偏显示效果是这样的，
摸索了好一阵子也不知道是哪里出了问题，然后经过半个小时的排查，原来我将“全部图书分类 更多”所在的div的display属性设置为inline,代码如下：

.content div{
    display:inline;
}  

最后，我在网上找了一下原因，这种奇怪的结果是行内元素的特性所造成的。行内元素与块级元素相比具有以下特性：
1）行内元素不会单独占一行。
2）行内元素属于自适应宽高，设置width和height无效。
3）行内元素仅水平方向的padding和margin可产生边距效果。