Archived topic
Help with text and button aligment
5 replies · Started by Robert on April 25, 2022
Hello,
I have on my website a 5 collum grid full width. Even if on some resolutions the text and the button are displayed perfectly, on some everything gets messy.
Please see this image for example https://imgur.com/a/qzz2H5g
Is there a fix for that or do I have to use the same volume of the text so the containers have the same behavior?
Kind regards,
Robert
Hi there,
it requires CSS to force align elements, not sure if it will work on that overlay layout though. If you want to share a link to where i can see the issue then ill take a look.
Here is the link: https://retetediabetici.ro/ half page
Thanks!
Try this:
1. Add this CSS:
.align-bottom-button .gb-container,
.align-bottom-button .gb-container .gb-inside-container {
display: flex;
flex-direction: column;
height: 100%;
}
.align-bottom-button .gb-container .gb-inside-container .gb-button-wrapper {
margin-top: auto;
}
2. Then edit the page, and Select the Grid Block and in Advanced > Additional CSS Class(es) add: align-bottom-button
As the name suggests that should keep the buttons aligned at the bottom of the container.
PERFECT! This should keep me away from the support forum for a while.
Thank you so much!
You're welcome