To change the layout **direction**, in the "Page Content" component, select the "Small" breakpoint variant.

Change the auto layout direction to "Vertical". In the code, this would be done using the [[layout-vertical--sm]] class. Read more [here](https://design.basis.com/foundations/layouts).

Navigate to the Small breakpoint screen to preview the change.

To update the layout **Gap**, select a breakpoint variant.

Select a new gap value. In the code, this would be done by changing [[layout-gap-3]] to [[layout-gap-1]].

Navigate to the breakpoint screen to preview the changes.

Learn more about layout [here](https://design.basis.com/foundations/layouts).

Responsive - Update Layout Direction & Gap