Support » Themes and Templates » Finding the tag class in twentyfourteen

  • I’m one little triangle away from completing our firm’s new intranet site. I am using a child theme of the included twentyfourteen theme. While inserting color and formatting changes to my child theme’s style.css file I cannot for the life of me find where to change this little triangle from the tag symbol. It looks fine when no mouse is hovering, but when I hover over it with my mouse, the body of the tag changes to red (as I want it to) but the little triangle to the left must be in a different class that I cannot find. Please assist! Thanks!

Viewing 9 replies - 1 through 9 (of 9 total)
  • esmi


    Forum Moderator

    Try using Firefox with the Firebug add-on for this kind of CSS troubleshooting. Or use whatever developer tool is available in your web browser.

    I have been. I just cannot seem to locate that pesky little triangle!



    Forum Moderator

    Can you be more specific? Exactly where does this triangle appear?

    I write a post. I add a tag. I publish the post.

    Then a summary of the post exists on the blog page or any page that displays the summary.

    At the bottom of the summary is a little graphic tag that looks like a price tag. I found the css style to change the hover color of the main portion of the tag but there is a little triangle that I cannot find the style for.

    Is there any way to add an attachment to this discussion? I have an image.

    This is my modification in the child theme style.css that works:

    .entry-meta .tag-links a:hover {
        background-color: #c8102e;


    Forum Moderator

    It’s perfectly obvious using Firebug:

    .entry-meta .tag-links a:before {
        border-bottom: 10px solid rgba(0, 0, 0, 0);
        border-right: 8px solid #767676;
        border-top: 10px solid rgba(0, 0, 0, 0);
        content: "";
        height: 0;
        left: -8px;
        position: absolute;
        top: 0;
        width: 0;

    Yes. I see that. But there is a little colored triangle on the left that I cannot seem to change. I have added a color change to that style but it doesn’t change the triangle.

    This is what you want for the triangle with the dot. It’s a before pseudoelement.

    .entry-meta .tag-links a:hover:before {
       border-right-color: #41a62a;

    I have a new hero.

    It works perfectly now!


Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Finding the tag class in twentyfourteen’ is closed to new replies.