drago_v

Мне нужно сделать на сайте меню, которое должно выглядеть точь-в-точь как на сайте topwar.ru, только с другими категориями. Пока что процесс остановился на такой стадии. CSS ul#topnav { margin: 0; padding: 0; float: left; width: 100%; list-style: none; position: relative; font-size: 1em; background: #B22222; } ul#topnav li { float: left; margin: 0; padding: 0; } ul#topnav li a { padding: 5px 15px; display: block; color: #ffffff; text-decoration: none; } ul#topnav li:hover { background: #E6E6FA; float: left; margin: 0; padding: 0;} ul#topnav li span { float: left; padding: 5px 0; position: absolute; left: 0; top:23px; display: none; width: 100%; background: #cccccc; color: #0000ff; } ul#topnav li:hover span { display: block; color: #000000; } ul#topnav li span a { display: inline; color: #111111; } ul#topnav li span a:hover {text-decoration: none; color: #B22222;} HTML <table><tr height="19"> <ul id="topnav"> <li><a href="#">Главное</a> <span> <a href="#">Новости</a> <a href="#">Статьи</a> <a href="#">Экономика</a> <a href="#">Выживание</a> <a href="#">Видео</a> </span> </li> <li> <a href="#">Вооружение</a> <!--Subnav Starts Here--> <span> <a href="#">Вооружение РФ</a> <a href="#">Вооружение США</a> <a href="#">Вооружение Китая</a> <a href="#">Вооружение других стран</a> </span> <!--Subnav Ends Here--> </li> <li><a href="#">О войне</a> <span> <a href="#">Фильмы о войне</a> <a href="#">Книги о войне</a> <a href="#">Игры о войне</a> <a href="#">Военные песни</a> </span> </li> <li><a href="#">Важное</a> <span> <a href="#">Обратная связь</a> <a href="#">Правила сайта</a> <a href="#">Наши друзья</a> </span> </li> <li> <a href="#">История</a> <span> <a href="#">Герои</a> <a href="#">Сражения</a> <a href="#">Вооружение</a> </span> </li> <li> <a href="#">Форум</a> <span><a></a></span> </li> </ul> </tr></table> Мне нужно, чтобы подменю с категориями не исчезало, а оставалось на месте после того, как я убираю курсор с категории в любое место сайта, а как это реализовать - не понимаю