Показать сообщение отдельно
  #1 (permalink)  
Старый 01.05.2011, 14:39
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,124

Поведение 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 больше по высоте чем в первом пункте меню - ховер не желает держать подменю видимым... Если оставить только обзац тест - меню работает нормально.

Как бы "побороть" эту проблемку
Ответить с цитированием