/ all snippets

Add Pill Background to Menu Items on Hover on Elementor Menu Widget

This CSS snippet adds a pill background to the menu items on the hover state on Elementor Menu widget.

If you don't have Elementor Pro, you can replace the prefix of "selector" with a CSS class you can define yourself. To add the CSS snippet, you can use the HTML widget.

selector .e-n-menu-item{
    background:white;
    padding:5px 15px;
    border-radius: 50px;
    transition: 0.4s ease;
}

selector .e-n-menu-item:hover{
    background:#D9F773;
    padding:5px 15px;
    border-radius: 50px;
}