Как редактировать код с горизонтальным меню на css?
Код состоит из двух частей html:
Код
<div id="menunav" style="width: 100%;"> <!-- shirina menu -->
<ul>
<li><a href="ссылка на страницу блога" title="всплывающая подсказка">Главная</a></li> <!-- vasi ssilki -->
<li><a href="ссылка на страницу блога" title="всплывающая подсказка">Контакты</a></li>
<li><a href="ссылка на страницу блога" title="всплывающая подсказка">Разное</a></li>
<li><a href="ссылка на страницу блога" title="всплывающая подсказка">Уроки</a></li>
<li><a href="ссылка на страницу блога" title="всплывающая подсказка">Свежее<sup><font color="#ff0000">new</font></sup></a></li>
<li><a href="http://www.blogger.com/home?pli=1" title="Войти">Войти</a></li>
</ul>
</div>
и css (заключен междутегами style):
Код
<style>
<!--
div#menunav {
float: left;
border-top: 0px solid #EB7777;
border-bottom: 0px solid #ffffff;
font-size: 18px;
background-color: #340B09;
padding: 5px 5px 5px 5px;
margin: 5px 0;
}
div#menunav ul {
margin: 0px;
padding: 5px;
}
* html div#menunav ul {
float: left;
border-left: 1px solid #ffffff; /* левая вертикальная черта к ul */
margin-left: 15px;
}
* html div#menunav a {
display: block;
}
div#menunav li {
float: left;
list-style-type: none; /* без маркеров списка */
background-color: #340B09; /* цвет кнопки до наведения */
border-right: 1px solid #FFFFFF; /* разделительные линии между li */
}
div#menunav li:first-child {
border-left: 1px solid #FFFFFF; /* первая вертикальная линия меню */
}
div#menunav a {
text-decoration: none; /* без подчёркивания ссылок */
padding: 5px 18px;
color: #ffffff;/* цвет шрифта */
}
div#menunav a:hover {
color: #ffffff;
}
div#menunav li:hover {
background-color: #57130F; /* цвет кнопки после наведения */
}
-->
</style>