Account Deleted
To make it responsive to any device you can use media queries for tablets and mobile. For more info visit https://www.freecodecamp.org/news/css-media-queries-breakpoints-media-types-standard-resolutions-and-more/
Marked as helpful
0
Design comparison
Solution retrospective
How can I make the card be centered Vertically? How do I add the color to the image?
Community feedback
Account Deleted
Hello @reTrazed, To center the card vertically and horizontally you can use flexbox properties to your body tag and change the height property to min-height property to 100vh like for example to your body tag:
from this
.body,html { background-color: var(--main-color); height: 100%;
}
to this
.body,html { background-color: var(--main-color); display: flex; min-height: 100vh; justify-content: center; align-items: center; }
Properties to add to the body: display: flex; min-height: 100vh; justify-content: center; align-items: center;
Marked as helpful
0
Please log in to post a comment
Log in with GitHub
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord