How to Modify the Divi Mobile Menu Style

If you see the normal mobile menu on most sites you see the three lines that are supposed to display as the mobile menu. Although this is widely accepted as the mobile menu it still confuses people who are not tech savvy and need more obvious visuals. In this video, I will show you how to modify the Divi theme mobile menu style to make it more obvious to the user browsing the website.

The code used in this video:

Additions to style.css:

/* Mobile Menu Edits */

.mobile_menu_bar:before {

.mobile_menu_bar:after {
color: #fff;

/* End Mobile Menu Edits */

If you do not have a child theme installed, please view this video showing in detail how to install a child theme for Divi. Also here is a link to the elegant themes font icons.

Do you like the WordPress theme I am using? You can purchase the Divi theme from Elegant Themes. There's a discount link below:

Elegant Themes

Here's a great book you can read if you are looking for inspiration. This book exploits the full functionality of the most used content management system in the world.

Just letting you know, I do get compensated if you make any purchases after using the link above or any of the links that lead to elegant themes on my website.


Web Hosting
Subscribe To Our Newsletter

Subscribe To Our Newsletter

Join our mailing list to receive the latest news and updates from our team.

You have Successfully Subscribed!