Ensuring a consistent navigation experience across all devices can enhance user satisfaction and usability on your website.
Displaying the desktop menu on mobile devices allows for a seamless transition between different screen sizes, maintaining the familiar navigation structure your users are accustomed to.
This article will guide you through the steps to display the desktop menu on mobile devices using Divi, ensuring a cohesive and user-friendly experience across all platforms.
Open the Menu module settings by clicking on the Gear icon
Go to Advanced Tab → Custom CSS → Free Form CSS and add this CSS code:
@media (max-width: 980px) {
selector .et_pb_menu__menu {
display: flex;
}
selector .et_mobile_nav_menu {
display: none;
}
}
The result can be seen in the screenshot below:
