The Divi Responsive Helper plugin comes with two separate but related column stacking features that affect the columns inside any Row in the Divi Builder. These two features allow you to control your Divi layouts on all devices and help make your sites responsive.

  • The Row Number of Columns feature allows you to set the number of columns that stack side-by-side on Desktop and Phone device sizes.
  • The Row Column Stacking Order feature allows you to change the order in which the columns stack on Desktop and Phone device sizes.

Please refer to our Row Number of Columns documentation and our Row Column Stacking Order documentation to learn more about each of these features and how to use them. A demo of the number of columns feature is provided below.

In the screenshot above, you can see the option in Theme Options to enable this feature. This activates additional settings located in the Advanced tab of any Row in the Divi Builder. In the next screenshot, you can see the options for choosing the number of columns to show on each device.

In the demo below, we demonstrate all of the possible scenarios so you can see how it works on each each device with any gutter size.

 

Row Gutter 1

1 Column

The Row Number of Columns feature is set to 1 on Tablet and Phone with the Row Gutter set to 1.

Column 1

2 Columns

The Row Number of Columns feature is set to 2 on Tablet and Phone with the Row Gutter set to 1.

Column 1

Column 2

3 Columns

The Row Number of Columns feature is set to 3 on Tablet and Phone with the Row Gutter set to 1.

Column 1

Column 2

Column 3

4 Columns

The Row Number of Columns feature is set to 4 on Tablet and Phone with the Row Gutter set to 1.

Column 1

Column 2

Column 3

Column 4

5 Columns

The Row Number of Columns feature is set to 5 on Tablet and Phone with the Row Gutter set to 1.

Column 1

Column 2

Column 3

Column 4

Column 5

6 Columns

The Row Number of Columns feature is set to 6 on Tablet and Phone with the Row Gutter set to 1.

Column 1

Column 2

Column 3

Column 4

Column 5

Column 6

Row Gutter 2

1 Column

The Row Number of Columns feature is set to 1 on Tablet and Phone with the Row Gutter set to 2.

Column 1

2 Columns

The Row Number of Columns feature is set to 2 on Tablet and Phone with the Row Gutter set to 2.

Column 1

Column 2

3 Columns

The Row Number of Columns feature is set to 3 on Tablet and Phone with the Row Gutter set to 2.

Column 1

Column 2

Column 3

4 Columns

The Row Number of Columns feature is set to 4 on Tablet and Phone with the Row Gutter set to 2.

Column 1

Column 2

Column 3

Column 4

5 Columns

The Row Number of Columns feature is set to 5 on Tablet and Phone with the Row Gutter set to 2.

Column 1

Column 2

Column 3

Column 4

Column 5

6 Columns

The Row Number of Columns feature is set to 6 on Tablet and Phone with the Row Gutter set to 2.

Column 1

Column 2

Column 3

Column 4

Column 5

Column 6

Row Gutter 3 (Default)

1 Column

The Row Number of Columns feature is set to 1 on Tablet and Phone with the Row Gutter set to 3.

Column 1

2 Columns

The Row Number of Columns feature is set to 2 on Tablet and Phone with the Row Gutter set to 3.

Column 1

Column 2

3 Columns

The Row Number of Columns feature is set to 3 on Tablet and Phone with the Row Gutter set to 3.

Column 1

Column 2

Column 3

4 Columns

The Row Number of Columns feature is set to 4 on Tablet and Phone with the Row Gutter set to 3.

Column 1

Column 2

Column 3

Column 4

5 Columns

The Row Number of Columns feature is set to 5 on Tablet and Phone with the Row Gutter set to 3.

Column 1

Column 2

Column 3

Column 4

Column 5

6 Columns

The Row Number of Columns feature is set to 6 on Tablet and Phone with the Row Gutter set to 3.

Column 1

Column 2

Column 3

Column 4

Column 5

Column 6

Row Gutter 4

1 Column

The Row Number of Columns feature is set to 1 on Tablet and Phone with the Row Gutter set to 4.

Column 1

2 Columns

The Row Number of Columns feature is set to 2 on Tablet and Phone with the Row Gutter set to 4.

Column 1

Column 2

3 Columns

The Row Number of Columns feature is set to 3 on Tablet and Phone with the Row Gutter set to 4.

Column 1

Column 2

Column 3

4 Columns

The Row Number of Columns feature is set to 4 on Tablet and Phone with the Row Gutter set to 4.

Column 1

Column 2

Column 3

Column 4

5 Columns

The Row Number of Columns feature is set to 5 on Tablet and Phone with the Row Gutter set to 4.

Column 1

Column 2

Column 3

Column 4

Column 5

6 Columns

The Row Number of Columns feature is set to 6 on Tablet and Phone with the Row Gutter set to 4.

Column 1

Column 2

Column 3

Column 4

Column 5

Column 6