SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Guru
    Join Date
    Nov 2000
    Posts
    741
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Adding underline

    I have the following code on my WordPress page:

    Code:
    <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. #2
    SitePoint Guru bronze trophy TheRaptor's Avatar
    Join Date
    Jul 2011
    Location
    New York
    Posts
    710
    Mentioned
    40 Post(s)
    Tagged
    0 Thread(s)
    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...
    Code CSS:
    a { text-decoration: none; }

    and remove it or just remove the "text-decoration: none;" part if there are many rules.
    TheRaptor - Joe

  3. #3
    SitePoint Mentor bronze trophy
    John_Betong's Avatar
    Join Date
    Aug 2005
    Location
    City of Angels
    Posts
    1,883
    Mentioned
    74 Post(s)
    Tagged
    6 Thread(s)
    Learn how to be ready for The New Move to Discourse

    How to make Make Money Now with a *NEW* look

    Be sure to congratulate Wolfshade on earning Member of the Month for August 2014

  4. #4
    SitePoint Guru
    Join Date
    Nov 2000
    Posts
    741
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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. #5
    SitePoint Guru bronze trophy TheRaptor's Avatar
    Join Date
    Jul 2011
    Location
    New York
    Posts
    710
    Mentioned
    40 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Jon Lawrance View Post
    There are other pages on the site where I don't want the underline, so that is why I want an inline css fix.
    Then you will need to give either the <p> or <a> tag an id or class and modify accordingly.

    So if you have this:
    Code HTML4Strict:
    <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:
    Code HTML4Strict:
    <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:
    Code CSS:
    a.no-underline { text-decoration: underline;  }
    And modify the class name to whatever you like.
    TheRaptor - Joe

  6. #6
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,722
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    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 .
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  7. #7
    SitePoint Guru
    Join Date
    Nov 2000
    Posts
    741
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks guys. That was really helpful.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •