Flexible height background images: is sizing a feature or bug?

I looked at your middle example and have this to say:

The effective height of the image and the container with the background-image applied are 4px different. You would have to force the container height to 294px to prevent the visual “wobble”.

BUT…

Instead of making the hovered image appear over the background image, you can set both images on the container’s background:

#container { background-image: url(…/Resources/normal.jpg); }
#container:hover { background-image: url(…/Resources/hover.jpg); }

The hovered style will inherit the same size/position as the normal, thus eliminating any possibility of “wobble”.


freewaytalk mailing list
email@hidden
Update your subscriptions at: