Using a two-column text block within a three-column layout
-
I have a page with a three-column layout, and I need one specific row to have a two-column layout, where the first column contains a block of text.
The goal is for the text to take up half of the page width while staying within the page margins.
Is it possible to do this with CSS? Any help or guidance would be much appreciated!
Here’s the page I’m working on: https://dev.ninetkaijser.nl/grote-tekeningen/l/
This page has the layout I need, but it uses a four-column setup, making it easier to create a two-column section: https://dev.ninetkaijser.nl/grote-tekeningen/xl/
The general Gridder settings for the page are as follows:
Desktop:
- Column Count: 3
- Column Gutter: 32 px
- Row Gutter: 32 px
- Set Frame: 48 px
Mobile:
- Column Count: 2
- Frame: 16 px
- Column Gutter: 16 px
- Row Gutter: 16 px
- Set Frame: 16 px
-
i dont really understand the question / issue
you can use a lot of columns and then resize your elements to span as many columns as you want
if you have lets say 30 columns, you can make an element be 15 columns width
and it will be half of the width of the layout -
Ah, of course! I can use a 6-column layout—2/6 for the 3-column setup and 3/6 for the 2-column one. Apologies for not thinking of this earlier, probably just need a bit more sleep. ;)
1/3
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it