Page 160 - CSS

CSS

.cards {
display: flex;
}
.card {
border: 1px solid #ccc;
margin: 10px 10px;
padding: 0 20px;
}
button {
height: 40px;
background: #fff;
padding: 0 40px;
border: 1px solid #000;
}
p:last-child {
text-align: center;
}

The layout will change and become like this:

In order to move the buttons to the bottom of the block, we need to apply display: flex; to the
card itself with the direction set to column. After that, we should select the last element inside the
card and set the margin-top to auto. This will push the last paragraph to the bottom of the card and
achieve the required result.

Final CSS:

.cards {
display: flex;
}
.card {
border: 1px solid #ccc;
margin: 10px 10px;
padding: 0 20px;

https://riptutorial.com/ 138