CSS hover effect not working

Problem

Below code works fine in ie 9 and not works in any other browser. When i mouse hover on list background will change the color, but it doesnt work

.menunews ul{margin:0px;padding:0px;list-style-type:none;}
.menunews a{display:block;color:#266CAE;
 height:30px;
 background:#ffffff;border-bottom: 1px solid   #ccc;overflow:hidden;width:100%;height:2.72em;line-height:2.75em;text-indent:2.02em;text- decoration:none;}

.menunews li a:hover{background:#ffffff;
background:-moz-linear-gradient(top,  #ffffff 0%, #f6f6f6 47%, #ededed 100%); 
background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color- stop(47%,#f6f6f6), color-stop(100%,#ededed)); 
background:-webkit-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); 
background:-o-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); 
background:-ms-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%);
 background:linear-gradient(to bottom,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); 
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 );color:#266CAE}

Html

<ul style="font-size:12px;"><li class="menunews"><a href="" >
<span style="margin-left:2px;">Hello test</span></a></li></ul></div>
Problem courtesy of: user2466994

Solution

hey actually you made the CSS in some other way that's why browsers doesn't understand your css code so i made some changes in your css and its working fine on all browsers as per your requirement so i hope this will help you.....

ul li.menunews {
    border-bottom: 1px solid #ccc;  
    list-style:none; 
    height:30px;
}
ul li.menunews a {
    display:block;
    color:#266CAE;
    text-decoration:none;
}
    
ul li.menunews:hover {
    background:#ffffff;
    background:-moz-linear-gradient(top,  #ffffff 0%, #f6f6f6 47%, #ededed 100%); 
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color- stop(47%,#f6f6f6), color-stop(100%,#ededed)); 
    background:-webkit-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); 
    background:-o-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); 
    background:-ms-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%);
    background:linear-gradient(to bottom,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); 
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 );color:#266CAE} 
}
<ul style="font-size:12px;">
    <li class="menunews"><a href="#"><span style="margin-left:2px;">Hello test</span></a></li>
</ul>

Solution courtesy of: Shailender Arora

Discussion

you have mentioned menunews class to li, the css should have been li.menunews ,use the below css code

 ul{
   margin:0px;
   padding:0px;
   list-style-type:none;
 }
 .menunews a{
        display:block;
        color:#266CAE;
        height:30px;
        background:#ffffff;
        border-bottom: 1px solid  #ccc;
        overflow:hidden;
        width:100%;
        height:2.72em;
        line-height:2.75em;
        text-indent:2.02em;
        text- decoration:none;
        }

 li.menunews a:hover{
      background:#ffffff;
      background:-moz-linear-gradient(top,#ffffff 0%,#f6f6f6 47%, #ededed 100%); 
      background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color- stop(47%,#f6f6f6), color-stop(100%,#ededed)); 
      background:-webkit-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); 
      background:-o-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); 
      background:-ms-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%);
      background:linear-gradient(to bottom,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); 
      filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 );
      color:#266CAE;
      }

Please see this DEMO

Discussion courtesy of: Pbk1303

Define your class in ul instead of li so as to take effect :

<ul class="menunews" style="font-size:12px;"><li ><a href="#" >
Discussion courtesy of: Afsar

This recipe can be found in it's original form on Stack Over Flow.