Nesting rows in a row

Hello,
I am trying to achieve this design in a section. i have a row in which i divided into two columns. But I need to nest rows and columns in one of the columns to place the four styling icons. so that it will look properly on mobile as well. Do you know how I can achieve this?
Thank you

Hi there,

You can not have a nested row unfortunately in the Cornerstone. Instead, you can use custom CSS code to float the images. Kindly add the elements needed and then get back to us with the URL of the page to help you code the correct CSS for that.

Thank you.

Hello,
I have the additional images and text. This is the design I am trying to implement.

the url is: http://37.60.249.204/~wigsbyba/home/

Thanks so much.

Hey @Jennine,

You can currently achieve that using the Block Grid shortcode placed inside a Text element. You can use the Image shortcode to insert an image in the block grid. That will give you the structure that you need. After that, we can give you some CSS tweaks.

There’s also an upcoming Global Blocks feature that might make this setup easier to achieve.

Thanks.

So I decided to just change the design to make it easier. the designed i changed it to is attached as well and also implemented in the template. You can see it here: http://37.60.249.204/~wigsbyba/home/
But when the screen resolution is smaller the icons are not floating properly and the image with the girl on the right moves up. Here is a screenshot of whats happening and I also attached a screen shot of I would like it to look when the screen size gets smaller. I would like them to then go to the two rows with the button below it on a smaller screensize. With a higher resolution size it is fine as is. The icons are all in a row. Usually I would nest another row and columns into that row and they would fall as expected. Im not sure how to do it here. you : )

Hi there,

Again, the problem is that you will need custom CSS code to do so and it is not what we offer at the moment. You will need to wait till the Global Blocks Feature be available as at the moment the change of the design does not have anything to do with the need for Custom CSS code anyway.

One thing that you can do is to have copies of the same section and lay them out differently in different browser window sizes. That is not an ideal solution as you do not have nested rows but it is good to know that you have this option at hand if you want to play with possibilities:

Thank you for your understanding.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.