title: CSS rollover problems with Internet Explorer 7
body: <p>I wrote some CSS in my HTML code to create rollover buttons. Then i tried to run it with IE 7 and surprise! it doesn't run. In fact it shows both the button and underlying rollover. How can i get around IE's inability to cache background images? Preferably using CSS but javascript 'will' be tried.</p>
  
  <p>Sample CSS:</p>
  
  <pre><code> #Menu 
   { 
      width: 100%; 
      height: 32px; 
      margin-top: 93px;
      padding-left: 13px;
  }
  
  
   #Menu a 
  { 
      height: 32px; 
      line-height: 32px; 
      width: 123px; 
      background: url("img/menu.png") top left no-repeat; 
      background-position: -123px 0; 
      float: left; 
      margin-left: 3px; 
      text-decoration: none; 
      color: #1e1e1d; 
      font-size: 12px; 
      text-align: center; 
  }
  
   #Top #Menu a:hover, #Top #Menu a.active 
  { 
      background-position: 0px 0; 
      text-decoration: underline;
  }
  </code></pre>