title: Style disabled button with CSS
body: <p>I'm trying to change the style of a button with an embedded image as seen in the following Fiddle:</p>
  
  <p><a href="http://jsfiddle.net/krishnathota/xzBaZ/1/">http://jsfiddle.net/krishnathota/xzBaZ/1/</a></p>
  
  <p>In the example there are no images, I'm afraid.</p>
  
  <p>I'm trying to:</p>
  
  <ol>
  <li>Change the <code>background-color</code> of the button when it is disabled</li>
  <li>Change the image in the button when it is disabled </li>
  <li>Disable the hover effect when disabled</li>
  <li>When you click on the image in the button and drag it, the image can be seen separately; I want to avoid that</li>
  <li>The text on the button can be selected. I want to avoid that, too.</li>
  </ol>
  
  <p>I tried doing in <code>button[disabled]</code>. But some effects could not be disabled. like
  <code>top: 1px; position: relative;</code> and image.</p>