Choose the number of Columns

Choose the number of Columns

With Divi you cannot choose if you want to have two, three or four columns side-by-side on mobile or tablet… Not anymore! You can now choose the number of columns that stack side-by-side on mobile and tablet.

1. Open up your Visual Builder and edit a Row. Go to the Advanced tab in the Rows Settings.
2. Toggle the option « CSS ID & Classes ».
3. Here you will see two new options called Number of Columns on Tablet and Number of Columns on Mobile.
4. You can now choose from the dropdown list how many columns do you want to have on mobile and tablet.
5. That’s all. Congratulations!

Set Column stacking orders

Set Column stacking orders

With Divi you cannot choose if you want to change the column stacking order on mobile or tablet… Not anymore! You can now choose which column will be the first and which one will be the second on mobile and tablet. No need to change your design layout or duplicate it just for mobile and tablet.

1. Open up your Visual Builder and edit a Row. Go to the Advanced tab in the Rows Settings.
2. Toggle the option « CSS ID & Classes ».
3. Here you will see two new options called Stacking Order on Tablet and Stacking Order on Mobile. You can choose to activate just for Tablets or Mobiles or both.
4. After that, go to the Content tab in the Rows Settings, and go inside the first Colums Settings by clicking the gear icon.
5. Go to the Advanced tab in the Columns Settings.
6. Toggle the option « CSS ID & Classes ».
7. Here you will see two new options called Stacking Order on Tablet and Stacking Order on Mobile.
8. You can now choose from the dropdown list the stacking order (from 1 to 6) on mobile and tablet.
9. You need to assign an order to EACH column!
10. That’s all. Congratulations!