Section Separator Effect

Support
#1

Heya!

I stumbled across this on a random site, and thought it was a neat effect. I have a couple ideas to implement using custom SVGs, but I figured first I’d give the built-in separator functionality of Pro a shot.

image
image1895×305 52.6 KB

May I lean on you first, to see if you’ve run across any creative cases that have already done this in Cornerstone? Or if not, would you happen to have an idea of how you might try this with section separators, ideally:

  • While also using parallax for any image backgrounds
  • Having the center point always be truly centered (which makes using a .png floated to the bottom of the div problematic)
#2

Hello @Rule72,

Thanks for writing in! Regretfully the separators in the screenshot cannot be accomplish with the Section Separator features in the theme. You can only have Angled In or Angled Out but not both. If you can share the URL of the page maybe we can check it how the separator was accomplished.

Best Regards.

#3

Ok! The route I took was a hybrid; if I have two sections, the 1st section ends up with an angled SVG inset with CSS, and the 2nd section ends up with the regular angled separator made to incline in the opposite direction. It gets a bit weird with breakpoints, but some media@ for the added SVG stuff makes this manageable.

image
image1905×224 2.78 KB

I’ll call this “close enough for government work” :rofl:

#4

Hey @Rule72,

We’re glad that you’re able to find a solution to your issue! If you have any other concerns or clarifications regarding our theme features, feel free to open up a new thread.

Thank you.

1 Like
#5

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