@FluffyKas
Posted
Hi there,
It looks very close to the original, there are only some corrections to be made in your HTML. ^^
-
You have no landmarks. Adding a
main
would do the trick. You either add it inside thebody
or you replace the carddiv
with it, both should be fine solutions. -
There's no reason to use
width: 100%
on the elements you used it on. Remove them, everything will stay the same. -
There's only one heading on this page so that should be an <h1> instead of <h2>. If you think about this design as part of a bigger website, you could still hide a <h1> somewhere, that gets rid of the issue in the accessibility report.
-
Your attribution could go in a
footer
.
Apart from these, good job! ^^
Marked as helpful
@grizhlieCodes
Posted
@FluffyKas Hiya, thanks for the feedback! Let me share my thoughts on it though, see what you think about it?
I don't have landmarks because I don't really consider this to be a website. I know what you mean but to me this is just about the .card
component (sort of how you'd write it in a framework essentially). Have you perhaps used a framework or perhaps tried injecting a bit a code with JS into your HTML? That's pretty much what I mean. 'That' particular piece of code.
I need to keep the width in there as I only submitted this solution to explain some stuff in a video (and I mentioned in it that you don't need to use the width in it hehe 😆 ).
h2
is used because, again, to me this is a component, not a website. So realistically this would be a h2/h3 or even a span in a real component since the website/page would already have a H1 in a hero (probably) 😅.
I think you have higher/stricter HTML standards than me when it comes to these component challenges! 😁👍
@FluffyKas
Posted
@grizhlieCodes Nah, none of the things are mentioned would be strictly necessary, since as you said it's just a component. I guess I'm just so bothered by the accessibility report, I always try to get rid of them :D
Marked as helpful
@grizhlieCodes
Posted
@FluffyKas Well Kas, I love when people are bothered, means they care haha. Thanks for keeping me on my toes :), I appreciate you.