[Support request] css selector for text inside main editor only?

[dale]

Hi. I’d like to apply some styling CSS only to the content of my blog posts (everything that I enter inside the main editing box, but not the title or sidebars). Is there a selector I can use so I can apply it sitewide?

[Leo]

Hi there,

Not quite sure if I understand.

Can you give me an example of what you are looking to achieve?

The page you linked is a the main blog page so the selector is a bit different than the rest of the pages.

Let me know.

[dale]

Oh sorry. I want to add underline to hyperlinks within the body of the post (not sidebars). Currently I use

.inside-article a, a:visited, a:active {
text-decoration: none;
}

.inside-article a:hover {
  text-decoration: underline;
  text-decoration-style: dotted;
}

which also applies to the title (if it’s hyperlinked), meta, and sidebars. I’d like something that only applies within the post so I can underline hyperlinks within the text——hyperlinks indicated only by certain colors can be difficult to see for people with correlating types of colorblindness, particularly if they appear in the middle of a paragraph. So I want the additional signal of underlining.

Initially I added

.inside-article a, a:visited, a:active {
  text-decoration: underline;
  text-decoration-style: solid;
}

but all those lines made for a cluttered page.

[Leo]

Just posts and not pages?

Try this:

.single .site-main a,
.single .site-main a:visited,
.single .site-main a:active {
    text-decoration: underline;
    text-decoration-style: solid;
}

[dale]

Thanks! That looks pretty good. It still hyperlinks the meta, but I assume there’s nothing to be done about that since meta is inside the post?

[Leo]

Hmm try this additional one as well:

.single .site-main .entry-meta a,
.single .site-main .entry-meta a:visited,
.single .site-main .entry-meta a:active {
    text-decoration: none;
}

Let me know.

[dale]

Hmmm, that removes the underlines from the body as well. Not sure why. But I can live with the underlines in the meta. It’s not optimal, but it’s not terrible either.

[Leo]

The additional code shouldn’t remove the underline from the body.

Can you added in so I can see why?

[Author]

Posts