Наследуемое левое положение отличается в IE - PullRequest
Новая
       16

Наследуемое левое положение отличается в IE

0 голосов
/ 13 января 2011

Я переоборудую развертываемые меню в существующий сайт, и он выглядит хорошо везде, кроме IE.Вот скрытая страница с новым меню: http://preemiestoday.com/pages/about_board.php

Код меню выглядит следующим образом: 

<ul>
<li  id='link0'><a href='/index.php'>Home</a></li>
<li  id='link1'><a href='/pages/about_new.php'  onmouseover='showabout()'  onmouseout='hideabout()'>About Us
<div id="aboutRollout" style="display:none" onmouseover="showabout()"  onmouseout="hideabout()">
<ul>
<li><a href="pages/about_new.php">Mission</a></li>
<li><a href="/pages/about_board.php">Board Members</a></li>

<li><a href="/pages/about_donate.php">Donate</a></li>
<li><a href="/pages/about_partners.php">Partners</a></li>
</ul></div></a></li>
<li  id='link2'><a href='/pages/members.php'>Join Us</a></li>

И так далее.CSS для развертывания about выглядит следующим образом: 

#aboutRollout {
position:absolute;
left:inherit;
top:193px;
width:120px;
z-index:5;
background-color:#CAD5EC;
color:#000;
border:1px solid #fff;
padding-top:5px;
z-index:100;
}
#aboutRollout LI {
border:none;
padding: 0 5px 5px 5px;
font-size:11px;
white-space:nowrap;
}

#aboutRollout LI A {
background-color:#CAD5EC;
color:#000;
text-decoration:none;
}

#aboutRollout LI A:HOVER {
background-color:#CAD5EC;
color:#000;
text-decoration:underline;
}

Проблема в том, что IE интерпретирует left:inherit; на #aboutRollout как конец текста ссылки, а не начало.

Есть ли какие-нибудь советы по настройке LI в IE?

1 Ответ

1 голос
/ 13 января 2011

Просто добавив эту DOCTYPE в качестве первой строки, чтобы вывести ее из «режима Quirks» в IE, выстраивает меню в IE7 / 8, Firefox, Chrome: 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Я не заметил, чтобы это испортило что-то еще (главное) на вашей странице.

...