修改一個li：將一個類懸停在與其他同一個li不同的位置：hover

Question

我試圖讓FlynnTec.com上最右側的「Store」按鈕具有圓角下角。我嘗試了所有我知道的選擇器，但出於某種原因「#menu li：hover .menu_right」不起作用，這顯然意味着我沒有使用正確的選擇器。

請幫忙！我是新來的！！

謝謝...

HTML：

<li class="menu_right"><a href="store.html" class="align_right">Store</a> 
</li> 

CSS：

#menu .menu_right { 
float:right; 
margin-right:0px; 
} 
#menu li:hover { 
background: #F4F4F4; 
background: -moz-linear-gradient(top, #F4F4F4, #EEEEEE); 
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F4F4F4), to(#EEEEEE)); 
border: 1px solid #777777; 
padding: 4px 9px 4px 9px; 
-moz-border-radius: 5px 5px 0px 0px; 
-webkit-border-radius: 5px 5px 0px 0px; 
border-radius: 5px 5px 0px 0px; 
} 
#menu li .align_right { 
/* Rounded Corners */ 
-moz-border-radius: 5px 0px 5px 5px; 
-webkit-border-radius: 5px 0px 5px 5px; 
border-radius: 5px 0px 5px 5px; 
} 
#menu li:hover .align_right { 
left:auto; 
right:-1px; 
top:auto; 
} 

Answer 1

添加樣式規則

#menu li.menu_right:hover { 
    background: #F4F4F4; 
    background: -moz-linear-gradient(top, #F4F4F4, #EEEEEE); 
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F4F4F4), to(#EEEEEE)); 
    border: 1px solid #777777; 
    padding: 4px 9px 4px 9px; 
     -webkit-border-radius: 5px; 
     -moz-border-radius: 5px; 
     border-radius: 5px; 
}