Understanding the responsive breakpoints
Before you set up your responsive grid you need to understand how the responsive breakpoints work.
The key points to understand are:
- There are 6 breakpoint widths
- Each breakpoint width can have its own settings
- You can choose Desktop first or Mobile first
- Desktop first means that properties and settings will inherit from the larger breakpoint
- Mobile first means that properties and settings will inherit from the smaller breakpoint
- By default, the grid is set to Desktop first
- When configuring your breakpoints, you will set the minimum width for each device. The diagram below shows how the minimum width is used
