Getting elements to align to the bottom of columns

Support
#1

Hi there,

I was wondering if you could help me? I would like to align elements to the bottom of columns, whether that be text or buttons. For example, the buttons here I would like to align to the bottom of the columns they are sat in without relying on gaps. Is there any easy way to do this?

Please see the link below

http://simplysignspreview.com/ucsactivenew/membership/

#2

Hello Jayd,

Thanks for writing in!

Simply enable the Flex Box option in each of the column settings and then set an auto Top margin to the last button element so that it will always be at the bottom of the column. Perhaps this video tutorials may help you:

Hope this helps.

#3

Hi there,

Thanks for coming back to me, this video is brilliant! Sadly it’s not working for me and not sure why. It might be because I have two columns within a column, or because I’m using a button. Perhaps you could advise further?

#4

I’m also having the same issues with the last 3 columns on the homepage - have followed all instructions but can only get the ‘Join Us’ column to conform. Do the columns need to be fixed height in order for this to work? If so, how do I fix the height? Many thanks.

http://simplysignspreview.com/ucsactivenew/

#5

Hey Jayd,

Upon checking, it’s only the last column that was setup incorrectly. You’ve set the bottom margin of last element which is a Text element to auto and the visible element above it to 0. It should be vice versa.

Once done, it should line up like this:

I see a Gap element above each text element in those 3 columns. Since they do nothing, please remove them to prevent to simplify the layout and prevent complications.

Hope that helps.

#6

Hi there,

Thanks for helping me with the homepage. I am not sure why in the blue box ‘see our membership options’ is indented, it’s very odd.

Please also check http://simplysignspreview.com/ucsactivenew/membership/ as I am unable to get the blue ‘enquire’ buttons to align to the bottom of the dark grey columns. Any advice appreciated.

#7

Hi there,

Sorry, coming back to the homepage it still doesnt really make sense. I can’t align the headings together even though it appears all settings are the same (red line) and can’t understand why the first block and second block are indented (black box - also present for email form). Any advice greatly appreciated.

#8

Hey Jayd,

The problem with your membership page is the same as in your home page. You applied the auto bottom margin to the last element which is the buttons and applied 0 bottom margin to the element above the buttons. Please check your settings.

-----------------------------------------------------------------------------------

Regarding the second to the last column element on your home page. The tutorial applies to the last element in the column only. If you need to align several other elements, please consider learning the Grid layout system. You can learn from the Grid video series in our Youtube Channel

Hope that helps.

#9

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