A truly simple to use, fully responsive grid layout system. Javascript free, and with a tiny footprint.
Built for the Stacks 3 plugin and beyond, this stack taps into the latest available features of the Stacks plugin.
Re-Order the cells you add to the grid at any time with simple drag and drop.
Independent horizontal and vertical gutters between cells.
Up to 4 columns can be displayed in the grid on any device size.
Easy selection of the number of columns to display at each device size.
Vertically align cell content of varying height to the top, middle or bottom on a row by row basis.
@Doobox Will your Grid stack create equal sized content boxes? (e.g. if I have different sized paragraphs in each box and each box has a border around it, will all of the boxes look the same size?)
It’s impossible to make images of different size (proportionately) look the same size in a grid.
You could make each cell of the grid have a background behind each image and have those backgrounds be of equal height on a row by row basis, or indeed make every cell in the grid posses a faux equal height.
However…!
Gid does not possess the ability to force a cell to be the same height as it’s neighbour, for a couple of reasons.
No Javascript. This could be done with javascript, but we have opted to keep this grid javascript free.
This could be done with CSS using table-cells. The reason we don’t do that is browser support. Older but still widely used browsers do not support table-cell.
