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.
- Build out the project to the designs provided
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
- Styled Components - For styles
We can center the content both horizontally and vertically easily using FlexBox.
<body></body>body {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}I want to continue focusing on learning flexbox and grid layout more. This is the concept that I need a lot of practice to get comfortable with.
- Flexbox Guide - This helped a lot while using Flexbox layout. I really liked this site and will use it going forward.
- Frontend Mentor - @Harshitsoni2000
- GitHub - @Harshitsoni2000