In this guide, we'll explain the inner columns and how you can use them.
Please note: Inner columns are only available in Semplice 6. If you're on an older version of Semplice, you can upgrade here.
So what are these Inner Columns?
When building a website, your content is placed in different columns that can be stacked vertically or horizontally. Each column now has an Inner column, which you can use to create a visually appealing layout. For instance, you can use Inner Columns to create tiles out of two columns set beside each other by adding spacing and applying a background color to each inner column. This feature gives you more flexibility and control over the design of your website.
If you want to learn more about Semplice layout system and get started with basics check out this guide.
An example
As an example we will make two cards with some content inside them.
First, we went ahead and created a headline, description and a button, putting all of them in one column. Then we duplicated this column by right-clicking, Column > Duplicate.
Here is what we've got:
Next, we selected Column editor and then went to the 'Inner Styling' tab. Here we've set a background color with a border for each inner column.
But as you can see there is a problem, the column content is touching the border. So in order to fix that we adjusted the inner column spacings.
Like so:
Pro tip: To make your workflow faster right-click the column with adjusted styling and the click Column > Copy Styles. After that right-click the column that need to have the same settings and click Column > Paste Styles. To learn more about the new context menu read this guide.
We hope this example helped to explain you the usage and possibilities of the new inner columns and inspired you to explore! Thank you for reading!