Show or Hide any Element on the Website Page for a certain Screen Size

Optimize website for different devices by changing element visibility based on screen size.

Adjusting element visibility by screen size is crucial for responsive designs. In this tutorial, we will hide an image element for viewers with a Desktop Screen.

Watch the entire video here, or you can go through each step explained below:

• Click on any element or any container (Box, Row, Column) that you want to hide.
• Navigate to its settings.
  
  
• Click on the Responsive Label.
  
  
  1. Screen Type: Select the screen type you want to adjust visibility for, such as desktop, tablet, or smartphone.
  2. Visibility: Set element visibility for chosen screen type by choosing visible to display or hidden to hide it.
     
     
• Click Hidden to hide the selected element or container for the specific device type.
  
  
• Preview the changes to ensure they are reflected correctly based on the screen size.