@correlucas
Posted
👾Hello again Juan , congratulations for your new solution!
I saw this old solution and I've some considerations for you (If I can):
1.The box-shadow is a bit too evident, this is due the opacity and blur. The secret to create a perfect and smooth shadow is to have low values for opacity and increase blur try this value instead: box-shadow: 0 0.9375rem 1.875rem -0.6875rem rgb(131 166 210 / 50%); If you’re not familiar to box-shadow you can use this site to create the shadow design and then just drop the code into the CSS: https://html-css-js.com/css/generator/box-shadow/
2.Take care witht he property overflow: hidden because sometimes this makes your content get cropped when the card scales.
3.Create a media query to make the stats section numbers stays in different rows each saving space, here's the code for that:
@media (max-width: 340px) {
.tarjeta-pie {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
}
✌️ I hope this helps you and happy coding!
Marked as helpful
