title: CSS Hover border without re sizing image
body: <p>I would like to ask what have I done wrong on my hover border-below function without re sizing the image? I have followed the guide given <a href="https://css-tricks.com/image-rollover-borders-that-do-not-change-layout/" rel="nofollow">here</a> under inner border but still my link when I hover the image still re size.</p>
  
  <pre><code>.navbar-div a img, .navbar-div a {
      border: none; 
      overflow: hidden; 
      float: left; 
  }
  
  .navbar-div a:hover { 
      border-bottom: 5px solid black; 
  }
  
  .navbar-div a:hover img { 
      margin: -5px; 
  </code></pre>
  
  <p>Here is my <a href="http://jsfiddle.net/4emhj1vp/" rel="nofollow">JSFiddle</a> link.</p>
  
  <p>Thank You</p>