georisval / profile-card-component

Frontend Mentor - Profile card component solution

This is a solution to the Profile card component challenge on Frontend Mentor.

Table of contents

• Frontend Mentor - Profile card component solution
  • Table of contents
  • Overview
    • The challenge
    • Screenshot
    • Links
  • My process
    • Built with
    • What I learned
    • Continued development
  • Author

Overview

The challenge

• Build out the project to the designs provided

Screenshot

Links

• Solution URL: Solution URL on Frontend Mentor
• Live Site URL: Live website

My process

Built with

• Semantic HTML5 markup
• CSS
• Flexbox
• Mobile-first workflow

What I learned

Better usage of Flexbox, positioning of images, preview of responsive using positioning alone. Pushed forward into the Semantics HTML.

Some of the tags:

<main></main>
<section></section>
<footer></footer>

Continued development

Continuing to look into Semantics HTML, managing classes/IDs.

Next focus: merging margins/paddings in order to clean my CSS code

Author

• Frontend Mentor - @GeorisVal
• Discord - Taida#6500