Sent by Holly Bergevin on 30 November 2004 03:03
From: Angus McIntyre [EMAIL-REMOVED]>
> http://dev.disoriented.net/
> I have a thumbnail image showing a
>man in a red shirt. It's a standard <a href="..."><img ... /></a>
>affair. In Windows Explorer, if you move your mouse anywhere over the
>image, the cursor changes to a hand and you can click to see a larger
>version of the picture.
>
>In Opera, Gecko- (Firefox on Mac and Windows) and Webkit-based
>browsers (Safari, Omniweb 5), if you point to the upper-left of the
>image, the cursor doesn't change and clicking does nothing. Only if
>you move your pointer down to the lower-right of the image does it
>become clickable. Normally, the clickable area should cover the whole
>image
>Does anyone have any
>explanation of why this occurs, and suggestions for what I could do
>to fix it?
Hi Angus,
The photocaption div is covering your thumbnail image, and this is why most browsers are not giving
you a clickable area until the image extends below that div. To test this out, give div.photocaption
a background color.
I can think of a couple of ways to solve the problem. One - If your thumbnails are *always* going
to be the same width, you can give the photocaption div a left margin large enough to get it out
from in front of the image.
If, however, you want the flexibility to have different widths of images, you can make the
following changes to your CSS.
div.thumb img {
border: 1px solid black;
position: relative; /* add */
z-index: 5; /* add */
}
IE isn't covering the image with div.photocaption, but the above changes/additions should fix up
other browsers, at least Windows browsers... Leave the background color on div.photocaption while
you test to see what happens.
hth,
~holly
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/