How to do lock a row to the bottom of a section?

[JDRDigital]

How to do lock a row to the bottom of a section?

[nico]

Hi @JDRDigital,

Thanks for writing in.

Not sure what you want to achieve. Would you mind sharing us more details or perhaps a sample URL/screenshot.

Once we fully understand what you want to achieve. We will do our best to help you.

Thank you so much.

[JDRDigital]

Hey @nico

By default our rows and elements are aligned to the center of the section.

If i want to take a row of elements and lock it to the bottom of an element how would i go about doing?

[Prasant]

Hello @JDRDigital,

Thanks for asking.

Actually I am still not very much sure but have you tried adjusting the section padding values to place elements in bottom area of section? Here is a screencast. https://cl.ly/3N0v1e0N0q0p

Also please take a look at following thread. May be you are looking for something like this:

Fix a button to side of browser window

Thanks.

[JDRDigital]

@Prasant Using padding doesn’t seem to work. I’ve attached the link to the page. I would like the badges in the header section to stick to the bottom of the section but they stay in the middle.

[nabeel]

Hi again,

Thanks you for the URL. First add the following code in the Theme Options > CSS:

#topsection {
    padding-bottom: 0;
}

Then give your badges container a class pbn to remove bottom padding. To learn more about helper classes please see https://theme.co/apex/forum/t/customizations-css-class-index/207

This should fix the issue.

Cheers!

[JDRDigital]

@Nabeel what do you mean by "give your badges container a class pbn to remove bottom padding. " Do you mean literally go to the image elements > and go to customize > and add “pbn” to the class area? What effect will this have?

[nabeel]

Hi again,

I meant to give a class to the container that has the badges in Pro content builder (see screenshot)

Also don’t forget to add the following code in the Theme Options > CSS:

#topsection {
    padding-bottom: 0;
}

Hope this helps!