html - ie7的布局问题

Question

看起来我的网站在 ie7 中看起来不太好（见下面的屏幕截图） 我应该是水平的菜单是垂直的，facebook 和 twitter 按钮彼此上方而不是彼此相邻。有没有办法解决这两个问题？非常感谢，

Answer 1

“我应该是水平的菜单是垂直的”

这种类型的 IE7 问题通常会在您尝试使用一组<li>或<div>标记时发生display:inline-block——这适用于 IE8 和其他浏览器的当前版本。

问题是，IE7 尊重display:inline-block，但仅限于默认情况下内联的元素，例如<span>or <a>。所以它只是将它们保持为块，因此它们垂直堆叠。

Answer 2

我会尝试float: left;同时申请#nav > li和#nav a。

这应该可以解决 IE7 的垂直堆栈问题。

Answer 3

干得好：

http://jsfiddle.net/aKPgt/

简而言之，改变：

display:inline-block;

到

display:inline;

并添加：

float:right;

请记住，您需要在无序列表中反转菜单项的顺序，因为您浮动的是 RIGHT 而不是 LEFT。