Background Image For Column Only

I’m trying to set the image so that it only takes up the entire left half of the Section, but the image only covers the Column.

Does anyone know how to make that work?

Hi @mrstreilein,

Thank you for writing in, please inspect the Row containing those columns and turn Off the Row’s Global Container option.

This will make your Row (and columns) take the fullwidth. Then add maybe around 6% right padding to your right column so the content won’t be on the right edge of the page.

And please add a gap element on your left column, because there is a current bug where the columns will mess up if there is one empty column in the row.

Hope it helps,
Cheers!

I don’t seem to have those options.

When I changed the Inner Container option it seems to have done the trick… I think… now I’m getting this issue, even when I put a gap element in.

Hey @mrstreilein,

Would you mind providing us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password

To know how to create a secure note, please check this out: https://theme.co/apex/forum/t/how-to-get-support/288

Thanks in advance.

Okay.

https://gullivergaragedoorsedmonton.ca

Hello @mrstreilein,

When you insert a gap element, you will need to set the height to at least 300 pixels.

I went ahead and edited your site. I added a gap element and enabled the marginless column option in the row settings.

Please check your page now.

Got it, thanks for your support. This is exactly what I was looking for.

You’re most welcome, @mrstreilein. Have a great day!

So new question.

How can I hide the columns with the gap in them on mobile? Because of the way the row/columns work the mobile version looks a bit odd, so I’d like to hide the columns with the gap elements on them.

Hello @mrstreilein,

You will need to hide the gap element and not the column. Once the gap element will not display, the height of the column will become less or almost no height at all. You can achieve that by clicking in the gap element, find the “Customize” tab and make use of the “Hide During Breakpoint” option. To understand how this option works, you might want to check out this article:

Hope this helps.

Found it, thank you.

You’re welcome!
It’s good to know that it has worked for you.

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