Поведение hover в ИЕ7
Столкнулся с не понятной мне ситуацией...
<!DOCTYPE html>
<html>
<head>
<style>
* {
margin: 0;
padding: 0;
}
html,
body {
width: 100%;
height: 100%;
background-color: #ffffff;
font-family: Arial;
font-size: 10pt;
}
#container {
position: relative;
min-width: 950px;
max-width: 1200px;
min-height: 100%;
margin-left: auto;
margin-right: auto;
background: url('img/head.jpg') repeat-x;
}
#content {
margin-left: 50px;
margin-right: 50px;
}
#h_menu {
float: left;
width: 228px;
list-style-type: none;
color: #117070;
font-size: 10pt;
}
#h_menu > li {
margin-bottom: 20px;
cursor: pointer;
border: 1px solid;
}
#h_menu > li:hover {
font-size: 12pt;
}
#h_menu li:hover .h_sub_menu {
display: block;
}
.h_sub_menu {
display: none;
margin-top: 18px;
margin-left: 19px;
list-style-type: none;
color: #149b9e;
font-size: 9pt;
}
.h_sub_menu > li {
margin-bottom: 20px;
}
.h_sub_menu > li:hover > span {
font-weight: bold;
background: url('img/h_sub_menu.jpg') repeat-x bottom;
}
#info {
margin-left: 277px;
}
#info > p {
/*line-height: 1.5;*/
font-size: 11pt;
text-align: justify;
}
</style>
<script>
</script>
</head>
<body>
<div id='container'>
<div id='content'>
<div id='cnt_box'>
<ul id='h_menu'>
<li>Сборочно-монтажное оборудование
<ul class='h_sub_menu'>
<li><span>Автоматы установки компонентов</span></li>
<li><span>Оборудование для трафаретной печати</span></li>
<li><span>Печи конвекционного оплавления</span></li>
<li><span>Конвейерные системы</span></li>
<li><span>Автоматы дозирования</span></li>
<li><span>Системы пайки волной</span></li>
<li><span>Системы селективной пайки</span></li>
</ul>
</li>
<li>Инспекционное оборудование</li>
<li>Испытательное оборудование</li>
<li>Вспомогательное оборудование</li>
<li>Шкафы сухого хранения</li>
<li>Б/у оборудование</li>
</ul>
<div id='info'>
<p>test</p>
<p>
Ганимед неравномерен. Магнитное поле оценивает годовой параллакс, однако большинство
спутников движутся вокруг своих планет в ту же сторону, в какую вращаются планеты.
Газопылевое облако вызывает центральный Ганимед, таким образом, атмосферы этих планет
плавно переходят в жидкую мантию. В отличие от пылевого и ионного хвостов, полнолуние
иллюстрирует межпланетный ионный хвост, об интересе Галла к астрономии и затмениям
Цицерон говорит также в трактате "О старости" (De senectute).
</p>
</div>
</div>
</div>
</body>
</html>
Проявляется в ИЕ7 точно. В Опере, ФФ и Хроме проблем нет...
Если информации в диве info больше по высоте чем в первом пункте меню - ховер не желает держать подменю видимым... Если оставить только обзац тест - меню работает нормально.
Как бы "побороть" эту проблемку |