Images jump 5 pixels on click

Question

I have two clickable images inside a div. They jump 3-6 pixels when clicked. If I set it to fixed or absolute it doesn't jump but floating the elements together in one div is good formatting.

 <div class="buttons">
     <a onclick="$('.positionHelper').scrollTo( {top:'-=100px', left:'0'}, 800 );" href="#">
         <img src="images/up.png" />
     </a>
     <a onclick="$('.positionHelper').scrollTo( {top:'+=100px', left:'0'}, 800 );" href="#">
         <img src="images/down.png" />
     </a>
 </div>

.buttons {
    float: left;
    margin-top: -34px;
    position: relative;
    top: 100%;
}

Answer 1

Set the line-height of .buttons to 0.