Skip to main content

Grid

Base​

Breakpoints​

To facilitate the implementation it is not necessary to pass all breakpoints. Once declared, the same value will be applied to the next breakpoints, according to this order:

  • smallMobile
  • mobile
  • tablet
  • desktop
  • largeDesktop

For example, if mobile is equal to 6, tablet, desktop and largeDesktop will have the same value if nothing is declared. However, smallMobile will be sized auto.

tip

If no breakpoint is defined, the grid will assume the value 12 for the columns. If there is no space available to display the 12 columns, the grid will automatically adjust to new rows.

Mobile​

Tablet​

Desktop​

Defining offset​

As a number​

As an object​

Reversing columns​

Hide elements according to viewport​

To hide the elements, use the Hidden component.

Feedback​