Unable to override original link hover color in CSS

• 

  justpi · Member · Jun 10, 2013 at 11:11 am

  • Copy link

  You’re right: the tab is not a link, so there’s no “a”. In my June 8 reply I gave the correct selector, you added the “a” in the post that starts with “Wonderful, this clears up A LOT!”, and then I copied it from that post without thinking about it.
  Here are the complete controls of that stupid tab (personally I would remove it instead of giving it any attention):

  .comments-area .bypostauthor cite span {
      background-color: rgba(230, 230, 230, 0.1);
      background-image: -moz-linear-gradient(center top , rgba(244, 244, 244, 0.8), rgba(230, 230, 230, 0.8));
      background-repeat: repeat-x;
      border: 1px solid #1F6F93;
      border-radius: 2px 2px 2px 2px;
      box-shadow: none;
      color: #1A5F7E;
      font-size: 0.714286rem;
      font-weight: normal;
      line-height: 1.42857;
      margin-left: 0.357143rem;
      padding: 0.142857rem 0.357143rem;
  }

  And careful with stylesheets you find elsewhere. The one you found is ok, but often it might not be the wordpress.COM version of the theme. Better use WP’s own:
  https://wpcom-themes.svn.automattic.com/
  https://wpcom-themes.svn.automattic.com/twentytwelve/style.css

• 

  songofthecedars · Member · Jun 10, 2013 at 12:29 pm

  • Copy link

  This is great. I found that there is a developer tool built right into Chrome that I think has the same functionality as the Firebug program you mentioned.

  The other major piece of the puzzle I was missing was figuring out that a:hover can only come after a and a:visited have been set. That was making some things behave strangely.

  Thanks to you I’ve got everything sorted :)

  Now I just need to save all these customizations in a text file somewhere before I lose them in an update or something.