Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • #570266

    I have added a ‘border-bottom’ to the sidebar menu so there is a visual effect similar to the main menu. However, I can’t get the border to meet the sidebar divider, and the text moves during hover. Plus, the first menu item doesn’t receive the hover effect due to existing border code.

    I’d appreciate any help. Thanks.


    Hi Veronica!

    Send us a link to the exact page where your using the sidebar menu so we can take a look.



    Any of these would be game. Same with under “services” or “about”.



    It’s still not clear to us what you are referring when you say “I can’t get the border to meet the sidebar divider” please share with us a mockup so we can help you better.

    To target the selected item please use the below css in Enfold > General Styling > Quick CSS

     .widget_nav_menu ul:first-child>.current_page_item>a:hover {
    /* Your css code here*/

    If you still have issue please create a admin login for us and share it in the private content



    I was using a “border bottom” call instead of “text decoration underline” because it can be designed better. However, the client is looking at the site and I didn’t want to offer them a broken hover effect.

    I’m sure you can add a border to the bottom of the sidebar links using your Inspector and see that the border won’t touch the sidebar border like the current page item’s border does. I’d like them to match. I’d also like the border to not affect the position of the words.




    The border is a way different effect than the underline.
    It would require, to achieve the best result, to also have an option on padding / margin and more customisations better.
    The best achievable results is the underline, as we suggested.

    Let us know if you have more questions, we will be more than happy to help.


Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.