Здравствуйте, учусь верстке.
Хочу сделать при наведении на ссылку меню, фоновое изображение.
Сделал коряво и все смещается, так как не очень разбираюсь в свойствах - 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>
