Работает на Firefox и Chrome; не на IE8 - PullRequest
1 голос
/ 05 июля 2011

Я пытаюсь создать очень простой сайт, используя 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;

Я был бы очень признателен, если бы кто-нибудь показал мне, как заставить это работать во всех трех браузерах. Спасибо. Крис.

Ответы [ 2 ]

0 голосов
/ 05 июля 2011

Используйте простые селекторы 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;
}
0 голосов
/ 05 июля 2011

IE обычно будет иметь эти проблемы.То, что вы можете попытаться сделать (может быть проще, чем попытаться заставить все браузеры работать с одним и тем же файлом CSS), - это создать специальный файл CSS только для IE 8.Чтобы добавить этот CSS-файл, просто используйте этот код:

<!--[if IE 8]><link rel="stylesheet" href="CSSForIE8.css" type="text/css" media="screen, projection"/><![endif]-->

Это будет работать, только если IE 8 является браузером.

...