Sometimes, we want to position a div at the bottom of its container with CSS.
In this article, we’ll look at how to position a div at the bottom of its container with CSS.
How to position a div at the bottom of its container with CSS?
To position a div at the bottom of its container with CSS, we use flexbox.
For instance, we write
.parent {
display: flex;
}
.child {
align-self: flex-end;
}
to make the element with class parent a flex container with display: flex;
.
Then we make the element with class child in the flex container stay at the bottom with align-self: flex-end;
.
Conclusion
To position a div at the bottom of its container with CSS, we use flexbox.