Responsive Settings

The Responsive Settings panel allows you to configure widget properties specifically for different screen sizes—ensuring your layout adapts gracefully across all devices.

Screen Type Tabs

• All: Properties set under this tab apply universally to all screen types (desktop, tablet, and mobile). Use this for consistent styling when you don’t need device-specific overrides.

• Desktop, Tablet, Mobile: These tabs allow you to override settings for specific device types. Any value set here will take precedence over the “All” tab for the corresponding device.

Available Properties

• Width: Defines the width of the widget. Can be set in fixed units or percentages.

• Height: Defines the height of the widget. Useful for maintaining vertical spacing consistency.

• Font Size: Adjusts the text size within the widget for improved readability across devices.

• Row Span: Determines how many rows the widget should span in a grid layout.

• Col Span: Determines how many columns the widget should span in a grid layout.

Note: If a property is set to Unset, the widget will inherit the default value or the value from the “All” tab (if applicable).

Best Practices

• Use the All tab for consistent styling when no device-specific behavior is required.

• Adjust properties under Desktop, Tablet, or Mobile tabs when layout or readability issues arise on different screen sizes.

• Preview changes on each screen type to ensure optimal user experience.