-
Posts
-
I know that I cannot nest columns. And, I know that I cannot put a grid row in a color section. But, I am trying to achieve an effect like the one below:
In a perfect world, this would be a color section with a blue background (easy to do). Within the color section would be two columns, each with a white background and an orange border (easy to do). Within each column is an image on the left and a text block on the right. (where I am stuck). Can this be done through an Enfold element or via a set of CSS?
Thank you
RogerI should mention that I can get the effect with a grid row — if only I could put the grid row within a color section.
Hi,
Thanks for your patience, try this:
a color section with a blue background ▸ 4 columns, each with a white background and an orange border ▸ inside each column, a text element with an image on the left and a text block on the right.
the expected results:
Best regards,
Mikebut you know that you can nest columns in a grid-row cell?
To have the grid-row not as full-width – you can add a snippet to your child-theme functions.php.See result and all code you need: https://enfold.webers-webdesign.de/grid-row-special/
PS: with no gap – there will be no gap !
I prefer to have here 1/4 cells besides each other and style them by grid layout.
but you can also style it as 1/2 Cells this way:
Wow! These are both great solutions. I have the first one implemented right now, but it is only good if I create different responsive versions. The word wrap doesn’t play at all widths.
@guenni007, your solution looks elegant! I will try that shortly. Thank you so much.
- You must be logged in to reply to this topic.