Sub menu nth-child styling

Home Forums Jevelin Theme Sub menu nth-child styling

Home Forums Jevelin Theme Sub menu nth-child styling

This topic contains 3 replies, has 2 voices, and was last updated by  Shufflehound Support 1 week, 1 day ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    RESOLVED Posts
  • Hello!
    I have a nth-child styling to my primary/parent nav, but I don’t want it to attribute to the sub nav (as seen in the attached screenshot). I’m not sure what I need to call different for the primary to separate the two.

     

    This is the styling I currently have under custom code (it’s the green “button” effect that’s showing up on the fifth item in the primary and sub navs:

    /* NAVIGATION CTA BUTTON */
    .sh-header .menu-item:nth-child(5) a {
    background-color: #38d430 !important;
    color: #fff !important;
    border-radius: 10px !important;
    padding: 6px 26px !important;
    position: relative;
    top: 22px;
    left: 0px;
    }
    
    .sh-header .menu-item:nth-child(5) a:hover {
    background-color: #00698f !important;
    border-color: transparent !important;
    color: #fff !important;
    transition: all 0.3s ease-in-out !important;
    }
    
    

    Thank you for your help!
    Laurel

    Attachments:
    You must be logged in to view attached files.

    Solution for this topic

    Hi Laurel,

     

    I hope you are well today and thank you for your question.

     

    Please try changing the CSS code as following.

     

    /* NAVIGATION CTA BUTTON */
    .sh-header .sh-nav-container > ul > li.menu-item:nth-child(5) a {
    background-color: #38d430 !important;
    color: #fff !important;
    border-radius: 10px !important;
    padding: 6px 26px !important;
    position: relative;
    top: 22px;
    left: 0px;
    }
    
    .sh-header .sh-nav-container > ul > li.menu-item:nth-child(5) a:hover {
    background-color: #00698f !important;
    border-color: transparent !important;
    color: #fff !important;
    transition: all 0.3s ease-in-out !important;
    }
    

     

    Best regards,
    Shufflehound team

    That did the trick 🙂 Looks like I just needed to get a little more specific with what I was calling. Thank you!

    You are most welcome here 🙂

Viewing 4 posts - 1 through 4 (of 4 total)