Reputation: 43
So I have an image that is between 2 anchor tags. the css for the image is..
#howDoesItWork {
position: absolute;
height: 31px;
width: 154px;
border-style: none;
top: 3px;
left: 20px;
}
the right 20 px of the image isn't being noticed as a link in firefox. It works fine in IE. I tried changing it to padding left: 20px and margin-left: 20px. It still shows that last 20px as not being part of the link. It works fine I take the positioning away completely though.
<a id="howDoesItWork" href="">
<img src="images/howDoesItWork.jpg" alt=""/>
</a>
FIXED: I set the z-index to 2. Apparent the menu right next to it was overlapping onto the howDoesItWork imaage.
Upvotes: 1
Views: 318
Reputation: 4295
When you absolute position the image the link doesn't use the image to base its width on.
Because you've set a left: 20px it will stick over the range of the link.
So you need to extend the coverage of the link. Without knowing anything else about your document (ie. columns, what you are trying to do) my best guess is:
a #howDoesItWork { padding-right: 20px; }
If that doesn't do it... just show us more information.
With the new html info it should be:
#howDoesItWork { padding-right: 20px; }
Upvotes: 2