Skip to content
Submitted over 3 years ago

flexbox, html, css

Nicole•10
@Nicoleyvette
A solution to the Profile card component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

  1. I had a hard time designing the circles as displayed in the example. I would love for someone to assist with the solution

  2. I choose the mobile version however I feel the sizing reflected that of the desktop version. Please provide feedback.

I am in the baby stages of learning HTML and CSS. I decided to try this project as I feel the best way for me to learn is to be hands on. The project is not perfect but its done. On to the next newbie challenge :)

Code

Please log in to post a comment

Log in

Community feedback

  • jjjayed•270
    @jjjayed

    Hey there! Congrats on your first project. Just a couple of things to address.

    1. A lot of the issues you have right now is because of the lack of responsiveness, that's why the design is strictly for mobile. I highly recommend reading up on responsive web design and using @media queries.

    2. I also noticed that your fonts aren't working because you need to put font-family: Kumbh Sans The plus sign is not needed for the CSS part.

    3. Lastly, a cool trick. Surround the "26" text with a span tag, while still being inside the h1 tag. You can then select that span tag in the CSS and change its font weight to 400.

    Hope this helps.

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