Button rollover moves slightly

It’s not moving for me- perhaps a browser problem?

Which browswer are you using?

If you look at the text is moves side to side slightly.

I tried it in Firefox and Safari, and I’m getting the same issue.

I’ve reloaded the page about 5 times- and using Chrome at the minute. All that happens is the download button turns blue- guess that supposed to happen, but no, nothing else except the text ” Download” itself moves- and it does so naturally, and very slightly (took me some time to notice it). Is that what you were talking about?

Yeah, it’s a very SLIGHT move to the side. Even if you look at the sides of the button you see it kind of moves a little bit.

It’s not an issue with the image as the colours are the only thing that change. Everything else stays in the same place and size.

Thoughts on how I can fix this?

Thanks,
Qusai

it seems to be caused by:

#overlay-inner a:hover,
.comment-body p a:hover,
.entry-content a:hover{
	padding: 1px 3px;
	margin: -1px -3px;
}

if you set margin:0; for your a:hover on your button code, you should be fine.

Worked like a charm! Thanks!

Only issue is in IE 8 when you rollover, there’s a millisecond of no button. Thought that was a little weird.

But it is fixed in Firefox and Safari now!

Thanks a lot!
Qusai

if you turn the button into a css sprite (a single image with a shift in background position instead of two separate images), you might get rid of the delay on :hover.

Cool, I’ll try that out.

Thanks a lot for your help!
Qusai