Being selective with Hyperlink Cues Options

[bek1]

Hello.

I have code in my CSS file that looks like this:

CODE

a[href$='.pdf'] {
    background:transparent url(../img/icons/page_white_acrobat.png) center left no-repeat;
    display:inline-block;
    padding-left:20px;
    line-height:15px; }

It works great. My problem is that I need to have some links not show the image cue. I'm actually a desktop developer, so it's all pretty new to me. Does anyone know how I can use this with *some* PDF links, but not others?

This post has been edited by bek1: Apr 9 2012, 01:16 PM

[Darin McGrew]

Please see the FAQ entry Where can I learn about CSS?

[bek1]

Please see the FAQ entry Where can I learn about CSS?

Thanks, Darin. There is certainly a LOT to learn about CSS. Unfortunately for me as a desktop developer, time is a limiting factor. I have to jump in, learn enough in my free time to get by and get the job done, then get back to what pays the bills. However, Pandy was incredibly helpful above and I very much appreciate it.

[pandy]

In your second example there is no link text for the PDF link, nothing to click on. Furthermore you've nested links. You can't do that. The "outer" link also contains a P. Can't do that either. A can't contain block level elements.

[bek1]

In your second example there is no link text for the PDF link, nothing to click on. Furthermore you've nested links. You can't do that. The "outer" link also contains a P. Can't do that either. A can't contain block level elements.

Ahhh... I have a lot to learn. Thank you for the heads up.

[pandy]

See the links at the top and bottom of the pages here? The validator tells you what I told you, well, not about the lacking linktext, but about the nesting and that you Peed in your link.
The HTML reference has some handy information about what other elements an element can contain at the top of the page for each element. For example for A you can read: "Contents: inline elements except A". Sort of says it all. In the validator result you'll find clickable links to the related spots in the reference. So using the validator isn't only a way to find your errors, it's also an easy way to learn the basics without having to read the reference or the w3c spec from top to bottom.