Topic: How do I reverse rows with “grid auto flow”

matt_hc
March 12, 2025 at 11:23 am

I’m using the GB Pro grid block, and I have a two column grid. I am trying to figure out what to enter in the GRID AUTO FLOW field within the GRID LAYOUT settings to reverse the order of the grid elements. I’ve tried typing row-reverse, but it doesn’t seem to be working. I would prefer not to have to manually enter an order number for the elements in the grid to change the order as that becomes a headache when there are more elements within the grid.
Ying
March 12, 2025 at 1:06 pm

Hi there,

To reverse the order of the grid items, I don’t think grid-auto-flow is the one.

Unfortunately, it needs to be set for each of the grid items; for example, set 1st grid item’sgrid-column to 2/3, so it moves to the 2nd column; set the 2nd grid item’s grid-column to 1/2 and gird-row to 1/2.

For more info about grid-auto-flow:https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-flow

For more info about grid-columnhttps://developer.mozilla.org/en-US/docs/Web/CSS/grid-column
matt_hc
March 12, 2025 at 3:04 pm

Okay. I was just changing the ORDER value to -1 to get it to reverse before, and that also seemed to work. I was just thinking there might be a way to reverse the order in the same way that a flex container does.
Ying
March 13, 2025 at 8:04 am

Great! Yes, order works as well in this case.

Viewing 4 posts - 1 through 4 (of 4 total)

How do I reverse rows with “grid auto flow”