Anyone mind taking a quick look at this and finding the small amount of code that is making my images move on hover in FireFox to me anyway!

http://www.emmaflewers.com/works.html


Much appreciated.

FF adds a dotted outline around links by default and as your images are links ......

Anyway I can stop the images moving for FF users?

Same thing happens in Safari aswell. Surely it's something in my CSS code? I'll have a look for dotted links.

Nope It's nothing you have done.

It is an accessibility feature.

Turn it off for linked images with

a img:active {
     outline: none;
}

a img:focus{
     border: none;
}

I know what the issue is:

font-size:10pt; font-weight:bold; color: #14365A;

on my links...

How can I stop this affecting my images?

Thanks

font-size:10pt

PT are not a valid measurement for the web - it's px, em, or % - pts are for PRINT.

I believe your actual problem is coming from this code:

#gallery ul a:hover img {
border: 2px solid #333;
border-width: 5px 5px 5px;
color: #fff;
}

If you want an effect on hover, change the color of the border, but make sure there is the SAME width border on the link in the un-hovered state.