Bill Scheider wrote:
> Can someone explain one of the examples to me, though? On this page --
> http://www.brunildo.org/test/ImgHoverTest.html -- in the
> example labeled 'border on inline <a>' there's a bottom border (gray/red)
> and then the border on the left and right go up only about a fourth of
> the way.
That border is the consequence of the fact that an inline anchor doesn't
really wrap an image (included in the anchor, in the markup.) The height of
the anchor is dictated by the font size, and the heigth of the image is
completely ignored (not so the width, of course.) Try changing font size,
and you will see that left and right borders change their height.
The above is true in standard browsers (like FF), not in IE where the anchor
fully wraps the image. So that is a sort of usually undesired effect, since
usually one wants a border around the whole image.
If you really want a similar effect working cross browsers, that can
probably be obtained, but no so easily in IE/Win. If you instead want a
border completely wrapping the image (possibly omitting some sides), then
simply choose another method, like putting the border on the 'img' element
instead of the 'a' one.
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/