[Resolved] How to make text link in widgets change to italics when highlighted

Home Forums Support How to make text link in widgets change to italics when highlighted

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #1110137
    Cristo Rey

    On my site all the links change to italic when highlighted, thanks to the nifty little bit of css you gave me…I think this is it:

    .site-content a:hover {
    font-style: italic;
    } .

    I would like to do the same thing with the text links in my widgets so that everything is uniform.

    #1110182
    Leo
    Staff
    Customer Support

    Hi there,

    Edit your code this:

    .site-content a:hover, .footer-widgets a:hover {
        font-style: italic;
    }

    Let me know if this helps 🙂

    #1110236
    Cristo Rey

    Thanks, Leo

    Doesn’t seem to do it….cleared my cache. Changes to underline on hover (which is great), but no italics.

    #1110356
    David
    Staff
    Customer Support

    Hi there,

    where did you add the CSS Leo provided?

    Can you add it back in so we can take a look.

    #1110411
    Cristo Rey

    Hi David,

    I added it using GP’s simple css. Added at the bottom of the list of css. That’s about all I know about css.

    #1110427
    Cristo Rey

    By the way, the sidebar widgets do change to italics….just not the footer widgets.

    #1110458
    David
    Staff
    Customer Support

    Can you try placing it at the top of the CSS list ?

    #1110461
    Cristo Rey

    Idid…and it works! Don’t understand why, but I will take it. Thanks, David.

    #1110465
    David
    Staff
    Customer Support

    It means you have an error somewhere else in your CSS… this is the problem:

    .main-navigation:not(.is_stuck) .sticky-brand {
        display: none;
        remove_action('generate_after_header', 'generate_add_navigation_after_header', 5);
    
        add_action('generate_after_header_content', function() {
                generate_navigation_position();
            }
    
        );
    
    .woocommerce-product-gallery {
        display: block !important;
    }

    The remove_action script is PHP so needs to be removed from there. Replace the code with:

    .main-navigation:not(.is_stuck) .sticky-brand {
        display: none;
    }
    
    .woocommerce-product-gallery {
        display: block !important;
    }
    #1110641
    Cristo Rey

    Thanks…made the changes you suggested.

    #1110652
    David
    Staff
    Customer Support
Viewing 11 posts - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.