Profile Card Component

Hello Aziz!!, congrats on completing this challenge. Here are some tips to make your code better.

• To center your container, you can simply make use of flexbox on it's direct parent which in your case will be the <main>. Your code will look like so: main { display: flex; justify-content: center; align-items: center; min-height: 100vh; padding: 5rem 2rem; // Add padding on it's direct parent to avoid your container from touching the top, bottom and sides of the screen for mobile view. }

• Try to add classes as much as possible. The specificity will make your life easier as a frontend developer.

• If you're making use of a main tag for the purpose of semantics, you should close off your attribution with a landmark like a footer.

• Always apply this reset for images: img { display: block; max-width: 100%; } This will keep your image inside its container at full width. Look up other css resets and apply them. Here's one: css resets

• Please pay attention to the accessibility and validation reports on frontend mentor.

I hope you find this helpful. Happy coding.