Нужна помощь с меню.

Добрый день, друзья подскажите как с горизонтального меню сделать вертикальное ?

Вот код меню:

<div class="top-menu">

		<a href="/"><span>Главная</span></a>

		<a href="#"><span>Новости</span></a>

		<a href="#"><span>Статьи</span></a>

        <a href="/obzor"><span>Обзоры</span></a>

		<a href="/sdelay_sam/"><span>Сделай сам</span></a>

		<a href="#"><span>Фотогалерея</span></a>

	  <a href="/o-nas.html"><span>О нас</span></a>

        <a href="/index.php?do=feedback"><span>Обратная связь</span></a>

        

		<div style="clear: both;"></div>

	</div>

	

Вот Ccs

.top-menu {

		background: url(../images/top-menu.png) left top no-repeat;

		height: 29px;

		clear: both;

	}

	

		.top-menu a {

			float: left;

			display: block;

			font-size: 11px;

			font-weight: bold;

			color: #000;

			background: url(../images/top-menu2.png) left top no-repeat;

			text-transform: uppercase;

		}

		

			.top-menu a:first-child {

				background: none;

				border-radius:3px 0 0 3px; 

				-webkit-border-radius:3px 0 0 3px; 

				-moz-border-radius:3px 0 0 3px;

			}

		

			.top-menu a span {

				height: 29px;

				line-height: 29px;

				padding: 0 25px 0 25px;

				float: left;

			}

			

			.top-menu a:hover {

				background: url(../images/top-menu2.png) left -29px repeat-x;

				color: #fff;

			}

			

				.top-menu a:hover span {

					background: url(../images/top-menu2.png) center bottom no-repeat;

				}

Вчера целый день убил что бы сделать, но не смог:mad: