Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
15
Comments
2
Mohammad Ashir
@A-shir1

All comments

  • zebra not donkey•145
    @zebra-not-donkey
    Submitted over 4 years ago

    profile-card-component-main

    2
    Mohammad Ashir•140
    @A-shir1
    Posted over 4 years ago

    Okay first of all, top tier username.

    Amazing work consider this is your first project and it took you just 4 hours .

    Try to work on its responsiveness. And don't worry too much about whether it looks good or not, just pay attention to detail and it will look good.

  • Elmer Gallardo•10
    @egallardo
    Submitted over 4 years ago

    Profile Card Component using HTML and CSS

    1
    Mohammad Ashir•140
    @A-shir1
    Posted over 4 years ago

    For the background images, try putting them in css using the background-image: url (images/images/bg-pattern-top.svg), instead of putting them in HTML with img tags.

    Few more things that I noticed :-

    1- For the body height try using height: 100vh; instead of hard coding using px.

    2- For the width of a div or image, try to use % or rem or em instead of pixels. What it does it makes the size just a little more dynamic to the screen width (in case of %).

    3- You have a typo in font-family and that is why the font wasnt applied.

    4- Try learning and implementing flex and flexbox. It makes your life sooo much easier.

    Seeing as you might be new to webdev, just keep practicing and dont stress it. It only gets easier :)

Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub