We use the Divi theme on many of our websites. This is a powerful WordPress theme. Sometimes you want to use the full menu on tablets in Divi instead of the mobile menu.
For instance, on a mobile you get:
Whereas on a desktop you get the full menu:
The way the Divi theme works is that on TABLETS (e.g. iPad) you get the mobile menu. This might not be what you want.
Jake, our wizard developer, came up with this bit of code that puts the full menu onto tablets:
So now you know. If you need assistance putting this on your Divi-powered WordPress website, then give us a call!
Whereas on a desktop you get the full menu:
The way the Divi theme works is that on TABLETS (e.g. iPad) you get the mobile menu. This might not be what you want.
Jake, our wizard developer, came up with this bit of code that puts the full menu onto tablets:
|
You will need to insert the following code into the CSS of the page.
(This code needs to go above any other code that targets certain sized screens)
/*Tablet Menu Shown*/
@media only screen and ( max-width:980px ) and ( min-width:500px ){
#top-menu-nav {
display:block !important;
margin-bottom:20px;
margin-top:6px
}
#top-menu {
display:block !important;
}
#et_mobile_nav_menu {
display:none !important;
}
.et-fixed-header #top-menu-nav {
margin-bottom:0;
}
/* set the width, and right align */
#top-menu-nav {
max-width: 980px;
right: 0;
left:auto;
}
} |
