glarks

Здравствуйте, учусь верстке. Хочу сделать при наведении на ссылку меню, фоновое изображение. Сделал коряво и все смещается, так как не очень разбираюсь в свойствах - display, position. Прошу помочь и по возможности ввести в курс дела! Код: #menu { text-align: center; text-decoration: none; font-weight: bold; margin-left: 100px; } #menu ul{ } #menu ul li{ float: left; margin-right: 106px; margin-top: 40px; } #menu ul li a{ color: #6b4848; text-align: center; display: block; } .activ, #menu ul li a:hover{ background: url(../images/menu1.png); width: 150px; height: 30px; background-position: center; } <div id="menu"> <ul> <li><a class="activ" href="#">HOME.</a></li> <li><a href="#">PORTFOLIO.</a></li> <li><a href="#">WHAT I DO.</a></li> <li><a href="#">CONTACT ME.</a></li> </ul> </div>