Webkit weird 1px underline on text

At http://www.wsl-ltd.co.uk/ i have a 'special offer' badge positioned absolutely with some text floated and relative inside.

For some reason, Webkit browsers are applying a red underline to some of the text - I have tried everything but just can't for the life 开发者_如何学编程of me work it out.

Does anyone know if this is a weird quirk of webkit, or is it my CSS? Cheers.

Bug in WebKit.

Define text-decoration:none; on the <a> element itself - should help.

The problem is with styles on <a> element. I think you could insert following to CSS to fix it.

.ie6wrap a {text-decoration:none}

(I checked it, you use .ie6wrap only for one element, so it should be safe)

If you want more details, following CSS is responsible for it:

a:link, a:visited, a:focus{
    color: #d58d31;
    text-decoration: underline;
}

You seem to remove underline on child elements of that <a>, but Webkit doesn't work in such way, because underline is under <a>, not on child <div>.

You have all the spans that contain the text wrapped in a single <a> tag, so the text is being underlined. You'll need to override the stylings to handle this, or move the <a> tag someplace else.

This happens because those spans are under

<a href="contact-us">

which has the following style:

a:link, a:visited, a:focus {
  color: #D58D31;
  text-decoration: underline;
}