html – CSS菜单IE7问题

前端之家收集整理的这篇文章主要介绍了html – CSS菜单IE7问题前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

菜单适用于所有主流浏览器,但在IE7中看起来有所不同.请参阅下面的屏幕截图
http://jsfiddle.net/FQLdm/6/查看演示

将鼠标悬停在主页链接上时,您将看到一个子菜单.在IE7中,菜单按钮和子菜单都被向上推.

这发生在我替换它的时候

  1. .menu1 ul.menu li{
  2. position: relative;
  3. list-style-type: none;
  4. display:block;
  5. float:left;
  6. }

有这个(我需要使用这种方式内联块来居中列表项)

  1. .menu1 ul.menu li{
  2. position: relative;
  3. list-style-type: none;
  4. display:inline;
  5. display:inline-block;
  6. *display:inline; /*IE7*/
  7. *zoom:1; /*IE7*/
  8. }

在Chrome中它看起来很好

在IE7中它看起来不同.请注意主页按钮是如何抬起的.它看起来应该像上面的chrome截图.

最佳答案
在你的李中写下vertical-align:middle.像这样:

  1. .menu1 ul.menu li{
  2. vertical-align:middle;
  3. position: relative;
  4. list-style-type: none;
  5. display:inline;
  6. display:inline-block;
  7. *display:inline; /*IE7*/
  8. *zoom:1; /*IE7*/
  9. }

猜你在找的HTML相关文章