Many menu’s have buttons on desktop that are simply too big for mobile. But if you simply hide the button on mobile (with Elementor’s Advanced Responsive settings) then that link isn’t available anymore on mobile (obviously). So I found 2 CSS snippets that we can use to hide menu items on desktop so that we keep the same links visible on mobile and desktop.
Need some help? Then watch my video tutorial here: [coming soon]
If you are working with the Elementor’s own (new) Menu Widget
#signup {
display:none;
}
@media screen and (max-width: 767px) {
#signup {
display:block; }
}
If you are working with the (original) WordPress Menu Widget in Elementor
@media (min-width: 767px){
.signup2{
display: none !important;
}
}