The Icon Box element can be convenient when you want to build this kind of box.
You have an icon, a title, some text and you can also add a link or a button:
Most of the time, you will prefer to have them with the same height.
So we just need to add a height (400px here):
It's a bit better but the alignment is still not great. Here are two ways to fix it
The "space-between" way
It distributes the items evenly: The first item is flush with the start, the last is flush with the end.
Note that the first item here, is the Title, and not the Icon. The Title, the text and the link are all parts of the same container.
.oxy-icon-box .oxy-icon-box-content {
display: flex;
flex-direction: column;
justify-content: space-between;
}
You can also replace .oxy-icon-box by your own class, if you don't want to change all the Icon Box of the page.
The "margin-top" way
We only move the button to the bottom. The rest (title and text) doesn't move.
.oxy-icon-box .oxy-icon-box-content {
display: flex;
flex-direction: column;
}
.oxy-icon-box .oxy-icon-box-link {
margin-top: auto;
}