Disabled items in dropdown menu still showing hovering effects

Created by: ripperdoc

It's my understanding that by adding .disabled to li in dropdown menus will disable them. However, the blue hover effect is not disabled.

The code in question is

.dropdown-menu .disabled > a:hover {
  text-decoration: none;
  cursor: default;
  background-color: transparent;
}

It override the background color, but the blue color also falls through from a background-image statement in the default hover selector:

  background-image: -moz-linear-gradient(top, #0088cc, #0077b3);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));
  background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);
  background-image: -o-linear-gradient(top, #0088cc, #0077b3);
  background-image: linear-gradient(to bottom, #0088cc, #0077b3);

Fix that works for me: set background-image: none; in the .disabled selector above, and all is fine, as such:

.dropdown-menu .disabled > a:hover {
  text-decoration: none;
  cursor: default;
  background-color: transparent;
  background-image: none;
}