title: Activating hover on image inside button when only button is hovered over?
body: <p>If I have a button with an image inside of it how can I activate the image hover when the cursor is hovered over the button but not the image itself?</p>
  
  <p>This is what I have so far:</p>
  
  <pre><code>&lt;button type="button" class="btn btn-normal"&gt;&lt;img src="images/contents/123.png"onmouseover="this.src='images/contents/123-hover.png'" onmouseout="this.src='images/contents/123.png'" class="image" /&gt;&lt;/div&gt;
  </code></pre>
  
  <p>css: </p>
  
  <pre><code>.btn-normal {
      background-color: #eee;
      padding: 15px!important;
      width: 250px;
      margin-bottom:20px;
  }
  .btn-normal:hover {
      background-color: #ddd;
  }
  .image {
      background-color: #ccc;
  }
  .image:hover {
      background-color: #009fe3;
  }
  </code></pre>
  
  <p>Really at a loss with this - any help is appreciated!</p>