html - Chrome で list-style-image が表示されない

Question

これは IE 9、Firefox 21.0 では正常に動作しますが、Chrome バージョン 28.0.1500.95 では動作しません。他のブラウザでこれを機能させるにはどうすればよいですか?

HTMLとCSSとして次のものがあります。

 <div class="footer">
    <div class="contact">
    <ul>
        <li ><a href="#">Contact</a></li>
        <li ><a href="#">Site Map</a><div ></div></li>
        <li ><a href="#">Legal</a></li>
        <li ><a href="#">Privacy Statement</a></li>
        <li ><a href="#">Send Feedback</a></li>
    </ul>
    </div>
    <div class="clear"></div>
    <div class="copyright">&copy; 2013 Hygeia Group. All Rights Reserved.</div>
    <!-- <br clear="all"/>-->
    <div class="social">
    <ul>
    <li><a href="#">Tweeter</a><div class="separator"></div></li>
    <li><a href="#">Youtube</a><div class="separator"></div></li>
    <li><a href="#">FaceBook</a><div class="separator"></div></li>
    <li><a href="#">LinkedIn</a><div class="separator"></div></li>
    </ul>
    </div>
</div>

    .footer {
      height:40px;
      font-size:11px;
      bottom:0px;

      }

    .footer  ul{
  margin-left:24.95%;
  list-style:none;
  list-style-type:none;
  list-style-image:none;
  list-style-image:url("../images/separator.png");
  z-index:50000;    
  list-style:none;
      }

      .footer ul li{
   padding:0 5px 0 0px;
   margin-right:15px;
   list-style:none;
   list-style-type:none;
   list-style-image:none;
   float:left;
   list-style-image:url("../images/separator.png");
   text-align: center;

       }

      .footer ul li > a{
   text-decoration:none;
   color:#666;  
   padding:0px 2px; 
       }
      .footer ul li:first-child {
   list-style-image:none
       }