Column widths with margins inside a row

Need help New Responsive Engine
1

I have a reusable element set to: column

  • It contains 2 rows. Row 1 is set to Left Aligned, Fixed width 80%
  • Inside Row 1 there 4 containers (columns), set to Fixed width 25%.

This works fine. However, when I apply a 10px right margin to the 4 column containers, the margin gets applied outside the 25%, so the 4th column wraps below column 1.

I am trying to have 4 equal width columns that take up 80% of the page width, with 10px between them. Can anyone help with what I am missing?

2

For your 4 equal width columns, set a min width of 0px and an inf max width and uncheck fit width to content. They will each grow to take up as much a space in the parent container as needed equally. Hope this helps!