Title: Link underlines in CSS
Last modified: August 18, 2016

---

# Link underlines in CSS

 *  Resolved [heathery](https://wordpress.org/support/users/heathery/)
 * (@heathery)
 * [19 years, 7 months ago](https://wordpress.org/support/topic/link-underlines-in-css/)
 * The only links I wanted underlined were within the post text so I made all the
   text decorations none and added:
 * .post a{
    text-decoration: underline; }
 * This works except 3 areas I don’t want underlined that are included in the post
   area – titles, category names and the “Leave a comment” line. Can anyone help?

Viewing 7 replies - 1 through 7 (of 7 total)

 *  [staceyl](https://wordpress.org/support/users/staceyl/)
 * (@staceyl)
 * [19 years, 7 months ago](https://wordpress.org/support/topic/link-underlines-in-css/#post-460092)
 * Well I’m no expert but personally I’d type:
 * `a.post{
    text-decoration: underline; }
 * instead of
 * `.post a{
    text-decoration: underline; }
 * But that won’t make a difference unless you have a whole  with the class of “
   post”. Instead, just class the link. E.g. `<a class="post" href="http://blah"
   >Home</a>`
 * And I’m not quite understanding the last part of what you said. You DON’T want
   a line beneath category names etc? In that case, create another link class such
   as:
    `a.noline{ text-decoration: underline; }
 * …for all the links that you don’t wany you have underlines. This would be a lot
   easier, in my opinion. Hope that helps you a bit.
 *  Thread Starter [heathery](https://wordpress.org/support/users/heathery/)
 * (@heathery)
 * [19 years, 7 months ago](https://wordpress.org/support/topic/link-underlines-in-css/#post-460093)
 * My site is castlefairchild.com. I’m using modified default and this is the area
   that will underline everything or nothing in the css ( I know hover is in it –
   but it’s default – not hover)
 * a, h2 a:hover, h3 a:hover {
    color: #147; text-decoration: none; }
 * it’s followed by this:
 * a:hover {
    color: #147; text-decoration: underline; }
 * This made no links underlined anywhere, which was fine except I wanted only links
   in the post text to underline…I searched the forums until I found
 * .post a{
    text-decoration: underline; }
 * but that underlines my post title, category at bottom of post and leave a comment
   line since those are technically links too.
 * I’m not good at code, but I find the area and alter it – so I’m not sure how 
   to set classes.
 *  [staceyl](https://wordpress.org/support/users/staceyl/)
 * (@staceyl)
 * [19 years, 7 months ago](https://wordpress.org/support/topic/link-underlines-in-css/#post-460095)
 * OK I see now hehe. In this case I WOULD use the
 * `.post a{
    text-decoration: underline; }
 * (which simply makes all links in the `<div id="post">` underlined, hence your
   problem).
 * However, to fix your problem I’d edit your index.php and single.php and class
   the header (you’ve obviously done this already) and the category and comment 
   links, so that you can control their styles and get rid of the underline.
 * So: `<a class="noline" href="http://comments.php">Leave a comment</a>`
    and `
   <a class="noline" href="http://category.php">Categories</a>`
 * And in your CSS, add:
 * `a.noline{
    text-decoration: underline; }
 * That SHOULD fix it.
 *  Thread Starter [heathery](https://wordpress.org/support/users/heathery/)
 * (@heathery)
 * [19 years, 7 months ago](https://wordpress.org/support/topic/link-underlines-in-css/#post-460098)
 * I understand what you mean…I’m just not sure where to add what (except the css,
   that I’ve got). Do I add the lines you have in both index and single?
 *  [staceyl](https://wordpress.org/support/users/staceyl/)
 * (@staceyl)
 * [19 years, 7 months ago](https://wordpress.org/support/topic/link-underlines-in-css/#post-460101)
 * OK, sorry hehe. Where it has
 * `<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link 
   to <?php the_title(); ?>"><?php the_title(); ?></a></h2>`
 * add `class="noline"` after the `<a`
 * Savvy? That takes care of the header and that should be the same for both files.
 * Then for the category and commenting bizo, where you have
 * `<p class="postmetadata">Posted in <a href="http://castlefairchild.com/?cat=3"
   title="View all posts in The United States of America" rel="category tag">The
   United States of America</a> <strong>|</strong> <a href="http://castlefairchild.
   com/?comments_popup=30" onclick="wpopen(this.href); return false">Leave a Comment»
   </a></p>`
 * Do the same, adding `class="noline"` after the `<a`s. There should only be 2.
 *  [Ryan Fitzer](https://wordpress.org/support/users/ryanfitzer/)
 * (@ryanfitzer)
 * [19 years, 7 months ago](https://wordpress.org/support/topic/link-underlines-in-css/#post-460104)
 * Just tested.
 * .post h2 a, .postmetadata a {
    text-decoration: none; }
 *  [Ryan Fitzer](https://wordpress.org/support/users/ryanfitzer/)
 * (@ryanfitzer)
 * [19 years, 7 months ago](https://wordpress.org/support/topic/link-underlines-in-css/#post-460105)
 * I tested it at the bottom of the style sheet so it overwrites whatever you had
   defined higher up in the sheet.

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Link underlines in CSS’ is closed to new replies.

 * 7 replies
 * 3 participants
 * Last reply from: [Ryan Fitzer](https://wordpress.org/support/users/ryanfitzer/)
 * Last activity: [19 years, 7 months ago](https://wordpress.org/support/topic/link-underlines-in-css/#post-460105)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics