Pranto-Bapary / profile-card-component

Here I made a Profile Card Component. I found this challenge on frontendmentor.io and tried to test my CSS skills.

Frontend Mentor - Profile card component solution

This is a solution to the Profile card component challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• The challenge
• Screenshot
• Links
• Built with
• What I learned
• Useful resources
• Author

The challenge

• I found this challenge on Frontendmentor.io and give it a try to test my CSS skills.

Screenshot

Links

• Solution URL: Github
• Live Site URL: Github Pages

Built with

• Semantic HTML5 markup
• CSS custom properties
• Flexbox
• CSS Grid
• CSS Animation
• Mobile-first workflow

What I learned

By creating this project I've learned to use flexbox and grid properly and also learned how to position a element in the proper way.

To see how you can add code snippets, see below:

<h1>Some HTML code I'm proud of</h1>

.proud-of-this-css {
  color: papayawhip;
}

const proudOfThisFunc = () => {
  console.log("Hello World");
};

Useful resources

• W3schools - This helped me for understanding overflow property for this project. I really liked the way they provide the content.

Author

• Website - Pranto Bapary
• Frontend Mentor - @pranto-bapary
• Facebook - @ashfe.pranto