link underline disappearing on hover

  • Hello I am a novice web developer creating an updatewd website for my merchandise printing business.

    My links to my product categories (halfway down page) are showing up underlined when the mouse does not hover over them, and not underlined when they are hovered over.

    Ideally I’d like these to either change colour on hover (as the menu links at the top do) or go bold, or have a border appear on hover, as I much prefer this style to any underlines.

    I’ve tried various css codes in my child themes css including:

    /*Remove Underline*/
    a {
    text-decoration: none;
    }

    /*Add hover color effect*/
    a:hover {
    color: #e05757;
    }

    AND
    .entry-content a {
    color: #008488;
    border: none;
    box-shadow: none;
    }

    .entry-content a:hover {
    color: #008488;
    }

    and various other css I have found on google including adding !important, but nothing seems to change the links at all.

    I wonder if it is something else within the storefront that is stopping me from being able to do this?

    Thanks in advance

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)

  • Hi there,

    You can use the following CSS as a starting point to control what happens when you hover over the Category Titles;

    h2.woocommerce-loop-category__title:hover {
    color: red;
}

    And you can use the following CSS to remove the underline from the titles as well;

    .hentry .entry-content a:not(.button) {
    text-decoration: none;
}

    You might need to play a bit with !important and here is a post with some ideas – https://css-tricks.com/having-fun-with-link-hover-effects/ ??

Viewing 1 replies (of 1 total)
  • The topic ‘link underline disappearing on hover’ is closed to new replies.