IE7下的兼容问题

1、在下面这个弹窗中，当里面的城市项碰到弹窗的边缘，就会出现折行的现象。

解决办法：在城市项的样式里，增加不折行的属性（white-space: nowrap;)，这个问题解决了。

2、在IE7下，上、下li之间有间距。

这是一个搜索框联想部分的切图。可以看到，li之间出现的缝隙。

解决办法：在li样式里增加vertical-align: bottom;属性。

3、display: inline-block 4像素问题

在我们用display: inline-block 布局时，明明已经设置了间距，但显示结果的间距却比设置的还大。

例如：下面的星星，我是用i标签做的，如果把所有的i标签写成一行，并设置margin 值，标签之间会按照我们设置的空隙显示。

如果，我们把每个i标签独占一行，在设置margin值的情况下，每个i标签之间的间距会比我设置的还大。这就是4像素问题。

主要原因是，html标签排版导致的，我们要将标签写成一行。而不是，让每个标签独立成一行。

解决办法：1、把标签写成一行；2、在父元素的样式里，增加font-size: 0的样式。