Skip to content
Submitted over 2 years ago

I designed it using the html and Css

Maher•110
@Maher0551071612
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Profile card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

I designed it using the HTML and CSS but this time I tried the @Media so the design is available for both desktops and mobiles.

Community feedback

  • Lucas 👾•104,340
    @correlucasPosted over 2 years ago

    Hello Maher, how are you? Congratulations for your solution!

    Overall your code seems all okay. There's only two things you could consider to improve your solution"

    1. Apply the background-color on the <body> instead of the <main> element. Applying the background to the body you'll make sure that your background will be ever full screen if you apply it combined to the height:100vh; Try to make the change below changing the background from main to body.

    body { background-color: hsl(185, 75%, 39%); height:100vh; }

    1. Check the solution report and fix the accessibility issues to make a concise and semantic html.

    Keep it up bro.

    Marked as helpful
    0
  • Maher•110
    @Maher0551071612Posted over 2 years ago

    I don't know what is wrong with URL that added to the CSS they are not working.

    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