First of all, huge thanks to Themeco team and community members – this forum is absolutely amazing! For someone new to web design, this is a goldmine of information.
I have a totally newbie question: how do I achieve the layout in the picture attached? Is it possible via Cornerstone, or should I use tables or maybe grids? I’ve played with different options, but couldn’t figure it out myself. I do need the borders around the whole thing. Ideally, it should also be responsive (the second column should go underneath the first one on smaller screens).
Hi Nico. Thanks for coming back to me, but I think I didn’t explain my idea clearly enough.
I add a section in Cornerstone and split it into 2 columns (step 1). But then I want to split the right column in half horizontally (step 2) and after that split the resulting bottom part in half again, this time vertically (step 3), as you can see in the picture. And I need each and every resulting block to have borders around it. Is it possible in Cornerstone?
I’ve managed to use [columns] shortcode in the right column to achieve sort of what I want, but I still can’t figure out how to add borders around each block.
I feel I’m missing something very simple and obvious here. 🙂
Sorry my site is not yet available, so I can’t post the URL, if that’s needed.
Yes, columns shortcode is needed to achieve the columns on the lower right column. To achieve the same border, inspect row and then set Marginless Columns to OFF
On the main left column’s style field add this: border: 1px solid #000000;
On the main right column’s style field, add this: border: 1px solid #000000; border-left-width:0;
Then on your column shortcode for left column add this: style="border: 1px solid #000000; border-left-width:0; border-bottom-width:0;"
Then on your column shortcode for right column add this: style="border-top: 1px solid #000000;"
Hope this helps.
This reply was modified 2 months, 1 week ago by Lely.