css - Vertically centering an image within a fixed sized element: offset on the top -


i want display thumbnail images within fixed sized square containers, centering thumbnails horizontally , vertically.

using height, line-height , vertical-align css properties, can achieve it, there's small offset on top (2px in example) , i'd understand why.

as workaround, can set negative top margin image, i'd avoid if possible (more prone breaking across browsers?). i'm surprised need -4px top margin counteract 2px offset.

any hint?

the fiddle: http://jsfiddle.net/glauberrocha/n6rme/

hey think want

remove margin -minus , add border in ul , li

live demo http://jsfiddle.net/n6rme/5/


Comments

Popular posts from this blog

How do you change vbulletin's home page to the forums instead of the default (CMS or Activity Stream)? -

c++ - Troubles when compiling phash program -