Hello, I have a css grid question. How to make sure fixed row spacing?

Author Posts

1101blueli

So I have a grid set in 4Rows.
https://prnt.sc/134if7s

However, without any heading content for the below 2 div. These rows are not in even spacing.
May I know it is possible to make those row even spacing with the microthemer UI? I am not really understand how the css grid works. I cannot figure how to do it…

Here is the page.
https://bit.ly/3wif5jV

Thanks..


Sebastian

Hey,

When you drag the grid area to create rows and columns, the default size of each row is “auto”. This means the natural height of the content sets the size. It’s often useful with content of varying height e.g. text. But if you want to set a uniform height, you could set something like 100px for all of the row fields.

See the Template tab of the grid properties. You may also want to click the chain icon in order to synchronise all four values.

Is that what you were looking for?

Thanks,
Sebastian

P.S. you may find this video on MT’s CSS grid properties useful.


1101blueli

Thank you so much!! My problem is resolved.
And the video is really helpful!!


Sebastian

Awesome!

You may also like this video too:

Creating ‘broken grid’ CSS layouts with Microthemer

🙂

You must login or register to reply to this topic.