Здравствуйте, все работает хорошо, за исключением того, что при увеличении в браузере масштаба, пункты меню переходят на новую строку, а хотелось бы, чтобы все было на одной.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="fixie.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title></title>
<style type="text/css">
#nav,
#nav ul {
background-color: #444;
font: 11px/28px Verdana, Arial, Helvetica, sans-serif;
list-style: none;
margin: 0px;
padding: 0px;
}
#nav {
border: 1px solid #000;
height: 28px;
width: 100%;
}
#nav a {
border-right: 1px solid #000;
color: #fff;
display: block;
padding: 0px 20px;
text-align: center;
text-decoration: none;
width: 70px;
}
#nav li {
float: left;
position: relative;
}
#nav li:hover,
#nav li.jshover {
background-color: #333;
}
#nav a:hover {
background-color: #ccc;
color: #000;
}
#nav ul {
border: 1px solid #000;
border-bottom: 0px;
border-top: 0px;
display: none;
left: 0px;
position: absolute;
top: 28px;
width: 108px;
}
#nav ul a {
border: 1px;
border-bottom: 1px solid #000;
width: 68px;
}
#nav li:hover ul,
#nav li.jshover ul {
display: block;
}
</style>
</head>
<body>
<ul id="nav">
<li><a href="#">Афиша</a></li>
<li><a href="#">Меню</a>
<ul>
<li><a href="#">Европейская кухня</a></li>
<li><a href="#">Японская кухня</a></li>
<li><a href="#">Корейская кухня</a></li>
</ul>
</li>
<li><a href="#">Фото</a>
<li><a href="#">Музыка</a></li>
<li><a href="#">Правила</a></li>
<li><a href="#">Контакты</a></li>
<li><a href="#">Информация</a></li>
</ul>
</body>
</html>