hub.eb?material_id=453&track_id=454

Bootstrap Column Offsetting


Bootstrap allows columns to be offset within a Bootstrap row. The size of this offset can be changed responsively using the class: offset-{bp}-{0|1|…|12}.

The offset increases the left-margin of the column by 1/12th of a bootstrap row's width multiplied by the integer used. 

It is usually possible to achieve the same layouts using the horizontal alignment properties rather then offsets which can make for a nicer user experience.

Steps


1

Create a new Form with a Bootstrap4 Presentation Template.

2

Create a Bootstrap Row Control and create four Bootstrap Column Controls within it.

3

Add the class offset-sm-4 to the third Bootstrap Column Control.

4

Run the form and observe the behaviour of the row and columns at different screen sizes by reducing the size of the browser window.

Current Module

Related