5 Columns Layout

I’d like to accomplish a 5 column horizontal layout, I read in the documentation that only 4 columns are available natively, can a 5th be added with CSS?

This website made a 5 column layout, but they are using CF7. I’m just thinking because GF is so much more advanced we should have no problem doing it.


There are CSS classes available that can be applied directly to the fields but you will lose the ability to drag and drop these fields in the editor (without losing your applied layout classes).

The above is achieved by adding “gfield–width-one-sixth” to each of the fields.

Hey David, thank you for the information.

I tried to implement the 5 wide layout using the code you provided. It was applied in the individual form fields appearance settings.

Screenshot 2023-01-01 163620

However the results it yielded for some reason don’t appear to be what was expected.

Any idea what I could be doing wrong?