Byron• 2,180
@byronbyron
Posted
Hi @jonathan401
Try this for the body:
body {
min-height: 100vh; /* min-height instead of height */
padding: 88px 1rem; /* a bit of spacing above and below for mobile */
font-family: sans-serif;
font-size: 15px;
display: flex;
justify-content: center;
align-items: center;
}
for the rounded corners on mobile:
.card-wrapper {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
overflow-x: hidden;
border-radius: 9px;
max-width: 300px; /* Add the max-width here */
}
/* then remove the max-width on screens larger than 992px */
@media (min-width: 992px) {
.card-wrapper {
max-width: none;
}
}
Marked as helpful
1