html - IE7中大型菜单的CSS

Question

参见 http://jsfiddle.net/jN5G4/1/

如何让“5 列”菜单下拉菜单像其他下拉菜单一样对齐？

我删除了 <a href...> </a> 5 列 列表项中的标记，现在从该元素下方下拉的下拉菜单会下拉到主菜单上方。

Answer 1

那是因为纯正文文本不会注册为 block 级元素，并且您的下拉菜单基本上与文本的顶部对齐。要解决这个问题，只需将纯文本添加到 block 级元素(如 p 标签)中或将其包含在 span 标签中，只需确保将其显示为 block 即可，像这样:

CSS

#menu li span {
  display:block;
}

HTML

<li>
   <span>5 Columns</span>
....