Overlayed images in link - clickable in Moz, not in IE

[John A.]

Hello.

I'm trying to have an image (a GIF with transparency) overlayed on
certain of several inline images that link to different pages.

What I have so far looks right (or right enough) in both SeaMonkey
(mozilla) and IE6, but in IE6 the link isn't clickable. It shows the
destination URL in the status bar but the cursor remains an arrow and
nothing happens when I click. In SeaMonkey it works just fine.

Here's my code...

In the CSS file:

img.ClearBug {
position:absolu te;
left: 0;
}

div.clearfab {
display: inline;
position: relative;
width: 100px;
}

In the page HTML:

<div class="clearfab ">
<a href="/XYZ.html">
<img SRC="/graphics/XYZ.jpg" BORDER=0 height=100 width=100>
<img SRC="/images/Clearance1.gif" BORDER=0 height=100 width=100
class="ClearBug ">
</a>
</div>

IMPORTANT: Note that because of compatibility issues with other
software the site uses I cannot use inline styles. It must be done
with external .css files.

Any clues as to why IE won't let me click the link? Is this a known
bug?

Thanks for any insight.
JA

[Spartanicus]

John A. <no*****@spamme rs.virginiaquil ter.allowed.com wrote:

>Here's my code...

Post an URL instead.

--
Spartanicus

[John A.]

On Fri, 13 Oct 2006 17:38:57 GMT, John A.
<no*****@spamme rs.virginiaquil ter.allowed.com wrote:

>Hello.

I'm trying to have an image (a GIF with transparency) overlayed on
certain of several inline images that link to different pages.

What I have so far looks right (or right enough) in both SeaMonkey
(mozilla) and IE6, but in IE6 the link isn't clickable. It shows the
destination URL in the status bar but the cursor remains an arrow and
nothing happens when I click. In SeaMonkey it works just fine.

Here's my code...

In the CSS file:

img.ClearBug {
position:absolu te;
left: 0;
}

div.clearfab {
display: inline;
position: relative;
width: 100px;
}

In the page HTML:

<div class="clearfab ">
<a href="/XYZ.html">
<img SRC="/graphics/XYZ.jpg" BORDER=0 height=100 width=100>
<img SRC="/images/Clearance1.gif" BORDER=0 height=100 width=100
class="ClearBug ">
</a>
</div>

IMPORTANT: Note that because of compatibility issues with other
software the site uses I cannot use inline styles. It must be done
with external .css files.

Any clues as to why IE won't let me click the link? Is this a known
bug?

Thanks for any insight.
JA

Never mind, I figured it out. I moved the first tag in the <apair
after the first image. Works fine in both browsers now. Must be a bug
in IE. Go figure.
JA