[Support request] I want to set a responsive border radius on the grid.

[jumin]

Hello.
I want to create my own site like the link site below from one of the designs in the library.
I want to use responsive border radius when using the grid. Please tell me how to do it.
Do I need a separate plugin (GenerateBlocks) to do this?
Thank you.

https://staging.lucasdesignlab.co.kr/

[Fernando]

Hi Jumin,

Can you give an example of a “responsive” border-radius?

[jumin]

hi
If you follow the link in my original post, you’ll see that the

there is a grid in the middle titled “LEARN Our driving courses”.
Both corners of the 3 thumbnails in this grid are rounded.
And when I reduce the display, both corners of the 2 thumbnails are rounded.
I would like to do the same for the grid located at https://gpsites.co/workout/style-guide/에.

Thanks

[Fernando]

I see. That’s added manually to the Image Block through the Spacing options in the Block settings. Reference: https://docs.generateblocks.com/article/spacing-options-overview/#border-radius

I’m not seeing a grid in the new link you provided. Can you check if the link is correct?

[jumin]

Oh I sent the wrong one.
If you look here: https://gpsites.co/workout/ there is a grid in the middle. I want to make this grid look like the one in https://staging.lucasdesignlab.co.kr/.

And I know I can make the top left or right or border round with the css you gave me.

Please see the picture below for what I want. I want the rounding to change to fit the display size.

https://ibb.co/xLkGz8L

[Fernando]

You should be able to do that through the Spacing options as mentioned here: https://generatepress.com/forums/topic/i-want-to-set-a-responsive-border-radius-on-the-grid/#post-2606622

Are you having specific difficulties adding the Border-radius? Can you try adding it first to the Container Blocks one by one?

[jumin]

https://staging.lucasdesignlab.co.kr/
The grid on this site has a border round on the third thumbnail and then changes to the second thumbnail as the screen size decreases.

How do I do this? What you said is just a css ’round’. It doesn’t change

[jumin]

I didn’t realize this was changing automatically, but rather one by one to make it responsive.
I’m not sure I understood that.
I thought the grid was automatically rounded for responsive.

Thanks

[Fernando]

Yes, it’s changed per view manually through the Block Settings.

You’re welcome, Jumin!

[Author]

Posts