Hello, Sky! 👋
Good job on this one! 🎉 Your solution responds well and overall looks good. Here's my suggestions:
- I think in this case
position: absoluteis a best way to align this quote marks image but you shouldn't put that image into your HTML and instead you should use::beforepseudo-element on.card-onecontainer. Set that pseudo-element to beposition: absoluteand within yourcontentproperty add image url -content: url(../images/bg-pattern-quotation.svg);. Then position it withtop&rightproperties. - Change the
altattributes for the.profile-imgavatars, as they don't add any extra context for screen reader users. Since your images are decorative youralttext should be provided empty (alt="") so that they can be ignored by assistive technologies. You can change.profile-nameto be your heading<h1-h6>element and it will be enough do describe this card in addition with.profile-position.
Good luck with that, have fun coding! 💪
2
Sky• 945
@Skyz03
Posted
@tediko Thank you for your feedback again ... Your comments are a great source of learning ... I did try to implement semantic HTML 5 from your last comments and still learning and implementing , also taking notes to apply to next projects. Will update this soon thanks! 😃👍
0
Sky• 945
@Skyz03
Posted
@tediko Thanks man updated the solution, learned how :before works now plus also got the idea of the report issue which was to implement h1 - h6 inside the section.
1
@Skyz03 Well done! :)
1
