title: How to remove background color from list items on a twitter bootstrap button dropdown menu?
body: <p>I am struggling with the button dropdowns, I cannot remove the blue background color that appears when hovering through the menu list items. I tried changing the a:hover CSS but with no success. Maybe this background color is dinamically added with javascript?</p>
  
  <p>Thanks!</p>
  
  <p><strong>Edit</strong>:</p>
  
  <p>I tried this code and no success:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="es"&gt;
    &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;meta http-equiv="content-type" content="text/html; charset=utf-8"/&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
      &lt;link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet"&gt;
      &lt;script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
  
    &lt;body&gt;
  
      &lt;style type="text/css" media="screen"&gt;
        .dropdown &gt; li &gt; a:hover {
            background-color: transparent;   
        }
      &lt;/style&gt;
  
      &lt;div class="btn-group"&gt;
        &lt;a class="btn dropdown-toggle" data-toggle="dropdown" href="#"&gt;
          Action
          &lt;span class="caret"&gt;&lt;/span&gt;
        &lt;/a&gt;
        &lt;ul class="dropdown-menu"&gt;
          &lt;li&gt;&lt;a href="#"&gt;link me&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;link me too&lt;/a&gt;&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
  
      &lt;script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js"&gt;&lt;/script&gt;
  
    &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>
  
  <p>It looks like the CSS background color is not applied to the  element. Why?</p>