Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
read ECONNRESET
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

3 Column Preview Card (HTML/CSS)

Maia 60

@maia-fw

Desktop design screenshot for the 3-column preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Any tips on how to center align the card? That seems to be the only thing I'm missing.

Community feedback

Account Deleted

Hello, solution looks good...My way would be to use display :flex; align-items:center; justify-content:center; on the body which centers the card so that adding margin:auto to container will not be required...

Marked as helpful

2

@manjeshrv592

Posted

On container set min height to 100vh, display to flex, align items to center.

.container {
min-height: 100vh;
display: flex;
align-items: center;
}

Marked as helpful

2

Please log in to post a comment

Log in with GitHub
Discord logo

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