Hello! I’m using the element (tag) called Sidemenu which is available in the WeWeb editor via the +Add button among the Basics elements. The Sidemenu has two sub-elements: One is called Menu and one is called Mobile. The element Mobile has a useful feature that it is visible only in the mobile views (tablet and phone). It is not visible in the desktop view. Hence a see a bar on the top of the screen only in the two mobile views. I’m wondering how this “magic” feature is achieved. This is rather not the name “Mobile”. I made an experiment: I made a copy of the element called Mobile (via Ctrl/D) and renamed it to Copy of Mobile. Now I see two bars one above each other in the mobile views and still no bar in the desktop view. So, where is the setting responsible for this phenomenon? And, could you show me the place in the online documentation where I could probably find an answer to my question? Thanks in advance! Greg
Hello @GregFalda
The Menu element has a display: none
set on desktop. And on the tablet breakpoint, it is set to display: flex
That’s a common way of adapting your designs depending on the breakpoints. Often on mobile, you want to hide decorative images to avoid the page of being too long — or replacing it with a more adequate design.
You can get more info on Responsive Design here: Responsive Design | WeWeb Documentation
1 Like