title: Button hover effect not showing after button is clicked/focused
body: <p>I'm developing a web application using the Vaadin framework.</p>
  
  <p>I have a Button styled as BaseTheme.BUTTON_LINK and have an icon showing.
  The button is assigned a CSS class which has a hover state, when the button is hovered the icon is replaced. Simple enough.</p>
  
  <p>However, I find that once the button is clicked, the hover stops working until you click elsewhere. The button seem to be focused after clicking and then the hover effect doesn't work.</p>
  
  <p>Does anyone know a way to work abound this, either using Vaadin or CSS?</p>
  
  <p><strong>EDIT:</strong> HTML and CSS added</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div style="height: 26px; width: 292px; overflow: hidden; float: left; padding-left: 6px; padding-top: 0px;"&gt;
    &lt;div style="float: left; margin-left: 0px;"&gt;
      &lt;div class="v-button v-button-link link v-button-m2m-refreshbutton m2m-refreshbutton" tabindex="0" role="button"&gt;
        &lt;span class="v-button-wrap"&gt;
          &lt;img class="v-icon" alt="" src="/M2M/VAADIN/themes/m2m/../m2m/img/refresh_.png"&gt;
          &lt;span class="v-button-caption"&gt;&lt;/span&gt;
        &lt;/span&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.m2m-refreshbutton:hover {
      background: url("../m2m/img/refresh_hover.png") no-repeat center;
  }
  </code></pre>