Elementor Pro

Elementor Pro – Mobile Nav Menu Styling

Get the latest from
Sniffle Valve

Sniffle Valve

Consider buying Sniffle Valve a coffee  

Book a one-on-one online training session

This tutorial shows you how to add text next to the “hamburger” menu and how to style it.

Adjust the CSS values to suit.

.elementor-menu-toggle:before {
    position: relative;
	content: "Menu";
    padding-right: 10px;
    bottom: 3px;
    color: red;
}
Add text before icon and set color

Set the background color to transparent and the icon bars to red.

.elementor-menu-toggle {
    color: red;
    background-color: transparent;
}
Transparent background with red bars

 

2 thoughts on “Elementor Pro – Mobile Nav Menu Styling”

  1. Genevieve Reid

    Is there a way I can remove the 3 lines and just have the words ‘menu’ ? Thanks in advance!

    1. Sniffle Valve

      Hi Genevieve,

      To remove (hide) the three lines (hamburger menu), use this CSS:

      .elementor-menu-toggle i::before {
      display: none;
      }

      Cheers!
      Lyle

Leave a Comment

Your email address will not be published. Required fields are marked *