css - 为什么我的背景图像在悬停时移动？ :(

Question

My problem is here
嗨，谁能告诉我，问题出在哪里？将 li 悬停在 .cerny 类之后，我的背景图像刚刚移动这是我的代码。

 aside nav ul {
           list-style-type:none;
           margin:0;
           padding:0;
           margin-top:25px;
        }


    li.cerny {
        height:50px;
        background: url("images/cerny.png") no-repeat top left;
        margin-left:-24.2px;
        margin-bottom:5px;
                }
        .cerny:hover {
        color:black;
        background: url("images/menu_hover.png") no-repeat top left;
        }

   .cerny a{
        text-decoration:none;
        color:wheat;
        display:block;
        padding-top:18px;
        padding-left:40px;
        font-size:15px;
 <aside>
     <nav>
          <ul>
  <li class="cerny"><a href="#"  style="margin-top:20px;">Můj statek</a></li>  
  <li class="cerny"><a href="#">Tržiště</a></li> 
  <li class="cerny"><a href="#">Město</a></li> 
  <li class="cerny"><a href="#">Soutěžní centrum</a></li>  
  <li class="cerny"><a href="#">Okolí</a></li>  
          </ul>
    </nav>
 </aside>

Answer 1

可能是您的图片(cerny.png 和menu_hover.png)大小不一样。在 Photoshop 中检查。