Adding underline

HTML & CSS
1

I have the following code on my WordPress page:

<p style="text-align: center;"> <span style="font-size: x-large;"><strong><a href="http://www.smartproductivityhacks.com/dl/7Sins.zip">Click here</a> to download the PDF Report for FREE!</strong></span></p>

The Click here text does not have an underline when viewed. How can I add that into that html?

Thanks,

Jon

2

By default that underline should be there. If it’s not, then there must be some css overriding it.

In your WordPress dashboard, go to Appearance > Editor and click style.css. In there look for a line that reads something like this…

a { text-decoration: none; }

and remove it or just remove the “text-decoration: none;” part if there are many rules.

3

Try this:

http://www.w3schools.com/cssref/pr_text_text-decoration.asp

4

There are other pages on the site where I don’t want the underline, so that is why I want an inline css fix.

5

Then you will need to give either the <p> or <a> tag an id or class and modify accordingly.

So if you have this:

<p style="text-align: center;"> <span style="font-size: x-large;"><strong><a href="http://www.smartproductivityhacks.com/dl/7Sins.zip">Click here</a> to download the PDF Report for FREE!</strong></span></p>

Change it to this:

<p style="text-align: center;"> <span style="font-size: x-large;"><strong><a class="no-underline" href="http://www.smartproductivityhacks.com/dl/7Sins.zip">Click here</a> to download the PDF Report for FREE!</strong></span></p>

And add this to your CSS file:

a.no-underline { text-decoration: underline;  }

And modify the class name to whatever you like.

6

You could give that anchor a class, and then give it the underline there :). Never use inline styles. They are just the biggest pain in the rear-end :).

7

Thanks guys. That was really helpful.