css tab bar height issue

[vahid_s2]

I try to implement a tab bar with extra padding on hover state.But the problem is on hover state actually it moves parent div. You can see the html below;\[code\]<div id="statNav"> <a href="http://stackoverflow.com/questions/15750186/#">Gogus</a> <a href="http://stackoverflow.com/questions/15750186/#">Kol</a> <a href="http://stackoverflow.com/questions/15750186/#">Gogus</a> <a href="http://stackoverflow.com/questions/15750186/#">Gogus</a> <a href="http://stackoverflow.com/questions/15750186/#">Gogus</a> <a href="http://stackoverflow.com/questions/15750186/#">Omuz</a> <a href="http://stackoverflow.com/questions/15750186/#">Gogus</a></div>\[/code\]and css;\[code\]#statNav{ width:100%; border-bottom:2px solid #9B2F2C; overflow:auto;}#statNav a{ float:left; background-color:#333333; color:white; font-size:12px; font-weight:bold; text-align:center; width:62px; padding-top: 5px; padding-bottom:5px; border-right: 1px solid #777777;}#statNav a:first-child{ -webkit-border-radius: 5px 0px 0px 0px; border-radius: 5px 0px 0px 0px;}#statNav a:last-child{ -webkit-border-radius: 0px 5px 0px 0px; border-radius: 0px 5px 0px 0px; border-right:none; width:63px;}#statNav a:hover{ -webkit-border-radius: 5px 5px 0px 0px; border-radius: 5px 5px 0px 0px; background-color:#9B2F2C; padding-top: 15px;}\[/code\]Here is the working sample;http://jsfiddle.net/Kg3p4/How can i solve it?