Underline links in blog post, not overall site

  • Unknown's avatar
    jslatsfqi · Member ·

    Hi, I have the CSS custom design upgrade with an Oxygen theme, and I’d like to be able to make the hyperlinks in individual blog posts underlined, but not those in the wider site.

    I can do the latter with a simple

    a:link {text-decoration: underline}

    but this applies the edit site-wide, and not just for individual blog posts.

    Also, once I can do this, I don’t want the “double-underline effect” on the “hover” mode, so I need to be able to change setting for the individual posts as well.

    Thanks!

    The blog I need help with is: (visible only to logged in users)

  • staff-totoro · Staff ·

    Hi there,

    I can see you are close. You can actually use a bit more specificity here, to better target that style.

    In this case, adding the following will limit the underlining to just links within the page/post itself:

    .hentry .entry-content a {
  text-decoration: underline;
}

    To remove the effect you see when you hover over those links, you can use even more specificity (in this case the pseudo class of “:hover”) to remove “double” underlining you see, which in this case is actually a border.

    .hentry .entry-content a:hover {
  border: none;
}
  • Unknown's avatar
    jslatsfqi · Member ·

    Thanks–did the trick!

    Also, from this, I would guess that using the “.hentry .entry-content” tag would allow me to edit all sorts of things within the blog entry, right?

    Exactly what I was looking for!

  • staff-totoro · Staff ·

    Yes, those two classes would apply to almost any element found with the text of a page/post, so if you want to use a similar CSS declaration to affect, say, the color of bold text, as you have done with links.

  • The topic ‘Underline links in blog post, not overall site’ is closed to new replies.