If you’ve played around with Divi, then you’ll realize there’s a default limitation to 4 columns that you can add per row. I am here today to show you how you can get around this with some CSS.
- Create a new row, with 1 column layout.
- Add a Divi Module of one of the following: Text or Blurb Module
- Inside the Advanced tab, then in the custom CSS area, inside the Main Element text block, add the following code:
4. Repeat step 3 until you have 5 Modules in total.
5. You will need to adjust the “width: 200px” to different numbers to see what fits best for your columns. But a good general rule of thumb is that you should divide the total width of your site by the number of columns you want, so that it equals. E.g.: 1200px width site, with 5 columns = 1200 / 5 = 240px. You should replace the width with: “width: 240px”.
If you need help with figuring out what your Divi website width is or how to adjust it, check out our post about Figuring Out The Width Of Your Divi Website.