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)

  • 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.

    Thread Starter bowlingbrad

    (@bowlingbrad)

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

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

    Thread Starter bowlingbrad

    (@bowlingbrad)

    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.

    Thread Starter bowlingbrad

    (@bowlingbrad)

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

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

    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;
}
    Thread Starter bowlingbrad

    (@bowlingbrad)

    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;
}

    Thread Starter bowlingbrad

    (@bowlingbrad)

    I have a new hero.

    It works perfectly now!

    Thanks!

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