Skip to content
Submitted over 3 years ago

RESPONSIVE SIMPLE PURPLE CARD JUST USING CSS AND HTML

SA•60
@SA-k97
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Stats preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Community feedback

  • Ediongsenyene Joseph I.•1,675
    @IEdiongPosted over 3 years ago

    Nice one 👍

    Some suggestions:

    • try not to use position: absolute; on the .card element. You could use
    body {
display: flex;
align-items: center;
}

    to center the .card in the page. You could also set margin-right: auto; and margin-left: auto; on the .card to center it horizontally

    • remove all default margin on the <body> that comes with the browser, set it to margin: 0;
    • try reducing the border-radius on the .card to 10px.
    • also, look into the accessibility issues raised in the report above.

    I hope this was helpful, Cheers 🥂

    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