我正在尝试创建一个菜单栏，其中包含一系列图标和水平布局的文本。我使用无序列表作为容器，但我遇到了问题。所有不包含文字的菜单项，只有一个带有背景图片的空锚标签，在线显示就好了。
但是，每当我尝试使用文本而不是背景图像作为菜单项时，文本列表项都会向下滑动。您可以在JSFiddle上看到此示例，请务必翻转每个项目以查看背景颜色指示器的行为：http://jsfiddle.net/pAfgm/6/。
注意每个带有地球图标的链接（是的，我在这个例子中从Facebook热链接）显示得很漂亮。然而，文本和它的背景指示符是偏离对齐的。我看到这是FF 3.6，Opera 11的情况，但不是IE7！一次，IE7没有其他浏览器的问题。
有人可以告诉我如何纠正这个问题吗？
感谢您的时间！
答案 0 :(得分：2)
您只需将vertical-align: top添加到nav.pluginBar ul.pluginBarLeft li，您还有display: inline-block。
请参阅： http://jsfiddle.net/pAfgm/7/
默认vertical-align值为baseline，这是造成此问题的原因。
在此处查看不同vertical-align值之间的差异：
http://www.brunildo.org/test/inline-block.html
有关图形说明，请参阅此处的“基线”部分：
http://blog.mozilla.com/webdev/2009/02/20/cross-browser-inline-block/