CSS does not work on .widget_nav_menu - by glenngtr

This topic has 4 replies, 2 voices, and was last updated 5 years, 10 months ago ago by Rose Tyler

  • Avatar: glenngtr
    glenngtr
    Participant
    May 11, 2018 at 15:41

    Hi there,

    I’ve tried for ages to style a navigation menu in one of the footer items in my static block. For some reason, whatever I try, my css code does not appear in the style sheet.

    If you look on the right bottom site, I would like to style the menu the same way as the other items. So

    -remove the white background when the menu item is active (only green color like the rest of the active links)
    -remove the borders beneath each item

    I’ve played around in all possible ways with “.widget_nav_menu li” and “.widget_nav_menu li.current-menu-item a” without success.Could you help please?

    All relevant info is in the private content field.

    Please, contact administrator
    for this information.
    3 Answers
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 11, 2018 at 16:16

    Hello,

    Please add this code in Theme Options > Custom css:

    footer .widget_nav_menu li.current-menu-item a {
        background-color: #f2f2f2;
    }
    footer .widget_nav_menu li a:hover {
        color: #95c11f !important;
        padding-top: 0;
        padding-bottom: 0;
    }
    footer .widget_nav_menu li {
        border:  none;
    }

    From the 4.0 update, all the custom styles come not like inline CSS but as styles from separate file – dynamic.css (to speed up the site loading). If you created child theme before 4.0 update you need to make changes in your child theme functions.php file and add one line http://prntscr.com/ikbhbt
    wp_enqueue_style( 'dynamic-css', get_stylesheet_directory_uri() . '/dynamic.css' );
    after that create an empty dynamic.css file in child theme directory.

    Regards

    Avatar: glenngtr
    glenngtr
    Participant
    May 14, 2018 at 14:00

    Thanks for the help! The only way I got it to work is to copy the code directly in my child’s dynamic.css file.

    Is it recommended to move all the old code of the style.css sheet to dynamic.css?

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 14, 2018 at 14:21

    You can add custom css code in 2 ways: style.css file of the child theme and Custom css area (Theme Options). To make custom code works from Theme Options, in child theme should be created the empty dynamic.css file and in functions.php of child theme should be added this code:
    wp_enqueue_style( 'dynamic-css', get_stylesheet_directory_uri() . '/dynamic.css' );

    Regards

  • Viewing 4 results - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.