@mattstuddert
Posted
Hey Sirriah, congrats on submitting your first solution!! You've done a really good job 👏
Here are my thoughts on your questions:
- When opening up the preview of your project, it loaded up quickly without a problem. So I can't replicate the issue you mentioned, as it seems fine. Perhaps the resource you mentioned loads pages slightly slower than usual? I really like your solution for positioning the circles, so I don't feel like there's anything wrong there.
- The circle patterns inside the card are purely decorative, so using
background-image
in your CSS is the right approach, in my opinion. It's the one I'd go for! - I wouldn't use
div
elements in these instances. First off, I'd have the name as ah1
. You should always have a singleh1
on any page. For the age and city, I'd usespan
elements, as they're not headings, not paragraphs, but they are written content.div
elements are used for generic structuring of content (an example would be grouping multiple elements together). Whereasspan
elements are generic content elements, so would be perfect here. For the "Followers", "Likes", "Photos" I'd say that these are headings, soh2
elements would make sense. However, to make it so they're genuine headings for those pieces of content and read in the right order for screen readers I'd put the headings first in the HTML and the numbers below inspan
elements. I'd then use Flexbox andflex-direction: column-reverse;
to flip them visually to match the design.
I hope that helps. As I said, amazing work on this project. I'm looking forward to seeing your future solutions!
@sirriah
Posted
@mattstuddert Thank you. :)
- OK, maybe I had some issue with internet connection, I will try it later :)
- ✅
- Wow, that is interesting solution. I will try to remake the code. Thank you for the inspiration!
@mattstuddert
Posted
@sirriah you're welcome! :)