html - 适用于 Firefox 和 Chrome；不在 IE8 上

Question

我正在尝试使用 Kompozer 创建一个非常简单的网站。我有一个水平菜单，在 Chrome 和 FF 中可以正常工作，但在 IE8 中不能。菜单的 HTML 是:

<div id="hmenu">
<ul>
<li>Home</li>
<li><a href="Portfolio.html">Portfolio</a></li>
<li><a href="Sounds.html">Sounds</a>
</li>
<li>Contact </li>
</ul>
</div>

CSS 中的相关位是:

#hmenu {
  border-style: none;
  text-align: center;
  width: 364px;
  height: 2.5em;
  margin-left: auto;
  line-height: 2.5em;
  margin-right: auto;
  font-family: Bauhaus;
  padding-bottom: 0px;
  font-size: 1em;
}
#hmenu *|ul {
  border-style: none;
  margin: 0;
  padding: 0;
  list-style-type: none;
}
#hmenu *|li {
  border-style: none;
  color: #009999;
  float: left;
  width: 85px;
}
#hmenu *|a {
  border-style: none;
  text-decoration: none;
  display: block;
}
#hmenu *|a:hover {
  border-style: none;
  background-color: #66ffff;

如果有人能告诉我如何使它在所有三种浏览器上工作，我将不胜感激。谢谢。克里斯。

Answer 1

使用简单的 css 选择器:http://jsfiddle.net/nyxyh/5/

#hmenu {
  border-style: none;
  text-align: center;
  width: 364px;
  height: 2.5em;
  margin-left: auto;
  line-height: 2.5em;
  margin-right: auto;
  font-family: Bauhaus;
  padding-bottom: 0px;
  font-size: 1em;
}
#hmenu ul {
  border-style: none;
  margin: 0;
  padding: 0;
  list-style-type: none;
}
#hmenu ul li {
  border-style: none;
  color: #009999;
  float: left;
  width: 85px;
}
#hmenu ul li a {
  border-style: none;
  text-decoration: none;
  display: block;
}
#hmenu ul li a:hover {
  border-style: none;
    background-color: #66ffff;
}