Webflow Grid Code

Community resources Show & Tell
1

Hi, I am using a Grid with over 700 Rows for one field and every time I have to change the size of the rows I have to do this 700 times manually and this takes a lot of time because this page has two fields for each screen size, which have to be adapted.

Is it possible to add a custom code so I can change the size for the rows at once, because they are all the same.

Bildschirmfoto 2023-12-05 um 18.00.22
Bildschirmfoto 2023-12-05 um 18.00.221250Ă—1254 137 KB

On the picture you can currently see 410 rows of over 700 with a size of 58px. They had the 60px before, but I am always deleting all the rows and creating one new one with 58px and then duplicating it until I have over 700 Rows again. Please do not ask why I need so many, I just need them.

2

:laughing: …but the answer to “why” is also the solution.
There are a lot of ways to do this but it depends entirely on what you are trying to do.

Set the auto rows property to 60px, and all new rows generated get that height. If Webflow doesn’t let you set that, you can do it with custom CSS with the grid-auto-rows: 60px property.

If that doesn’t work in your situation, you could generate the entire custom CSS using script, and inject it. You’d get the same resulting page, but not the same designer experience.

Alternatively, you could possibly use a classed DIV inside of your grid that sets the height, and just make the row height auto.

1 Like
4

Thank you for your help

5

Thank you very much for the code, i will try it out!

1 Like