Section Angle with background image

[Aidenwebb]

When using a section separator angle, the separator uses the background colour rather than the background image.

Ideally I’d like the background image to fill the section space including height added by an angled separator. It seems the angles or curves work by adding height rather than cutting into the section. Perhaps adding top/bottom padding and the angle cutting into the image would be a better option?

Is there a way to achieve my desired result using the theme in its current version?

[nabeel]

Hi there,

Thanks for writing around! Regretfully that might not be possible with section separators but you can do this with custom CSS. You can follow this https://css-tricks.com/creating-non-rectangular-headers/ or https://codepen.io/ahmadnassri/post/non-rectangular-headers-part-1#gradient-background-image-16 to achieve the similar effect.

Hope this helps!

[Aidenwebb]

Thanks, Nabeel. I shall have a play.
What’s the likelihood of this getting implemented in X? It’s becoming a bit of a trend and I’d like to maximise my laziness in future!

[Joao]

Hi There,

Actually you can achieve the same effect if you add the angle to the white section above.

So you will add a bottom section divider to the white section and it will give you the same effect as if you had it on the section with image.

Hope it helps

[Aidenwebb]

I tried this thinking the same but instead seem to get no effect at all.
After tinkering a bit more it seems that’s because I had my background transparent. Oops!

[Joao]

It seems like you managed to solve the issue.

Let us know if you still need help.

Thanks!