Section Dividers Alignment

[sebagc]

Hi Friends,
Im using the section dividers from the Design Cloud as a basis to make a sag divider for a site. I’m trying to place it on top of a section that has an image as background, so i need the divider to sit at the bottom of the section in a row without container. Sadly, whenever i try to activate the Flexbox Layout in order align it to the bottom the content disappears.
Is there another work around to this problem?
Here follows a image of the section.

Thank you very much in advance!
Best regards!

[ruenel]

Hello @sebagc,

Thanks for writing in!

The image do not set at the bottom of the section because of the 45 pixel default bottom padding. Please edit your page and make sure that the bottom padding of the section is set to 0.

If this is not helping, provide 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/docs/getting-support

Regards.

[sebagc]

Thank you Renuel, but sadly is not the bottom padding of the section.

Please see the secure note for access details.

Thanks again for the help!
Best regards

[christian]

Hey @sebagc,

Upon checking, I saw that your divider is seating perfectly at the bottom of the section.

The only problem that I see is the 1px line below your SVG divider. That one is coming from the SVG code so I’d recommend contacting the developer or the source of the SVG code.

Thanks.

[sebagc]

Hi Christian,
Thanks for checking. I understand what you say about the thin line bellow the SVG… i created it so i have to correct it. Sadly, the problem i mentioned you guys is not solved properly… i made it match de bottom with some padding and negative margin… but is not a proper solution because the padding varies in different screen sizes and the divider moves everywhere. Please see attached picture.

Please if possible see it as not only a problem affecting at this time, it would be good to have this kind of dividers to sit perfectly at the bottom of any section over an image(for instance to include it in the design cloud)

Thank you very much for all the help!
Best regards!

[ruenel]

Hello @sebagc,

You have a few spacing below your content area element because you have setup a minimum height in your section’s inline css. The minimum height code forces the section to create empty spaces after the row element.

I have removed it already and then I also set the gap width and height in your row settings to 0.

Setting a minimum height in the section is not recommend. You may set a minimum height in one of your rows or columns instead.

Best Regards.

[sebagc]

Thank you very much Ruenel!! You actually taught me a lot with your solution!
You guys are the best!
Best regards!!!

[ruenel]

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