How to fit 3 columns with margin on a row


I have placed 3 columns in the same row, each one of size 4.
I want to add a box shadow effect to each one of these columns but in order to look nice, I need to add a side margin between the columns. The problem is that - apparently - 3 columns plus a side margin can’t fit on one row.

Is there a way to solve this? Thanks!

One way would be to put a div into each column. Then apply a shadow and some padding to those divs. See example. The classes I used (.shadow and .p-3) are classes that Bootstrap 5 comes with.

3col-with-shadow.bloc (1.4 MB)


Have you tried using a 3 column bloc group instead? It’s there in the structure bloc options.