Monday, 8 June 2009

Add an image to an a tag with no underline

I had a task to add the media mime type icon to a list of document links. The problem was the client didn't want to have the icon underlined. The solution I used was taken from StackOverflow:

Updated the CSS to include

.no-underline {
text-decoration:none;
}
.underline {
text-decoration:underline;
}
And generate the link the XHTML as

<a href="#" class="no-underline">
<span class="underline">
Link text
</span>
<img src="/icon url" alt="alt" />
</a>

No comments: