styling bracketed content that follows the A link in an LI element

0 votes
asked Sep 13, 2017 by user3643520

I have built a sitemap in a WordPress site that shows links for pages, posts, archives, categories and authors and I am trying to work out how to target the bracketed content (eg (6) ) with css so I can make it a lighter colour than the link and bullet.

I want:

  • the bullet to be the std non link colour (in this case #000). I know how to do this
  • the link to be the std link colour (in this case #F00). I know how to do this
  • and the minor / bracketed content following the link to be a lighter colour (in this case #999). I am stuck with this

The output html looks like so:

<li><a href="/test/">Test</a> <span>May 20, 2017</span></li>
<li><a href='/2017/05/'>May 2017</a>&nbsp;(6)</li>
<li><a href="/category/uncategorised/" >Uncategorised</a> (8)</li>

For the Posts there is a span around the date so I am able to target that span with:

#sitemap li a + span

However how do I target the bracketed content in the Archive and Category links that do not have a span so I can make them #999 in colour?

Ideally I could add a span around the Archive and Category numbers with a filter but I don't know the code to do this and if a css solution is available I would prefer that for simplicity sake.

Thanks for any help.

Your answer

Your name to display (optional):
Privacy: Your email address will only be used for sending these notifications.
Anti-spam verification:
To avoid this verification in future, please log in or register.
Welcome to Q&A, where you can ask questions and receive answers from other members of the community.
Website Online Counter