html - 简单的菜单。 CSS 在 IE7 中不工作

Question

我有以下菜单。似乎适用于所有浏览器，但不适用于 IE6 或 IE7。是什么导致了问题，我该如何解决。

在 http://jsfiddle.net/2ysCC/ 查看工作示例

#menu_wrap {
    margin-top:20px auto 0 auto;
    padding:0;
    width:780px;
    height:40px;
    list-style-type:none;
}
.button a {
    cursor:pointer;
    text-align:center;
    font:13px/100% Arial, Helvetica, sans-serif;
    font-weight:bold;
    position:relative;
    min-width:50px;
    height:20px;
    float:left;
    padding:10px;
    padding-right:0;
    text-decoration:none;
}

.Red, .Red .button a {
    color:#faddde;
    background: #ed1c24;
}
.button:last-child a {
    float:left;
    border:none;
}

<ul id="menu_wrap" class="Red">
  <li class="button"><a href="#">Home</a></li>
  <li class="button"><a href="#">portfolio</a></li>
  <li class="button"><a href="#">Latest</a></li>
</ul>

这是它在 IE7 中的样子

Answer 1

添加“显示:内联；”给你的'li'。

#menu_wrap .button {
  display: inline;
}

这是一篇更详细地描述错误的文章:http://css-tricks.com/501-prevent-menu-stepdown/