Hi,
I’d like to show mobile menu when the screen width is < to 1018px. My menu contains too much items and when the screen is like a tablet one it splits the mega menu on 2 rows. Is there is a css code for this ? Something like :
@media (max-width: 1018px) {
#td-top-mobile-toggle {
display: inline-block;
position: relative;
}
}
Best regards
Hello,
Please provide a link to your site so I can inspect it.
Thank you!
Hi and thank you for your help.
Here is a link : http://www.lesarchersdethomas2.fr/
I want to avoid this : http://s1312.photobucket.com/user/oomfr/media/web-p1.jpg.html
and insteal switch to the mobile menu when the width of the screen is less than a desktop.
I hope you understand what i mean.
Best regards
Hi,
You could try the code provided below with this result
– https://www.screencast.com/t/HSMlIel5lCUh
@media (max-width: 1018px) {
#td-top-mobile-toggle {
display: inline-block;
position: relative;
}
#td-header-search-button-mob {
display: block;
}
.header-search-wrap .td-icon-search {
color: white!important;
height: 54px;
width: 54px;
line-height: 54px;
font-size: 22px;
margin-right: 2px;
}
.sf-menu,
#td-header-search-button {
display: none;
}
body .td-header-wrap .td-header-main-menu,
.td-header-wrap .td-header-menu-wrap-full {
background-color: #fdc42d !important;
}}
Or make modifications to it as you wish if needed, then enter it in Theme panel->Custom CSS section.
Thanks
Perfect ! Exactly what i needed 🙂
Thank you for your help !
