Previously, the Webflow Designer included specific choices for individual elements to adjust their visibility on different screen sizes. If you wished to make something visible on desktop and tablet but not on mobile screens, you would disable its visibility for the other screen sizes.
However, this method resulted in having several sources of truth.
To manage the visibility based on screen sizes, utilize the breakpoint selection located at the top of the Designer and set the display property of that specific class to display: none. To revert its visibility, you can simply reset it.
To impact visibility per element (for example, when you do not want every element with that class to disappear):
- Introduce a combo class (for instance, “hidden”)
- Define it with display: none
Subsequently, only that element (or any other elements that have been assigned that combo class) will be concealed.
Explore more about styling across various screen sizes.
Discover more about triggers and animations tailored for specific screen breakpoints.
- Include or eliminate Workspace spots and members - April 15, 2024
- Centering box summary - April 15, 2024
- Store a site for future reference - April 15, 2024