Looking to hire developers?
Any feedbacks are highly appreciated.
Thanks in advance!!
@A-amon
Posted
Hello! Great job~
You can check out CSS combinators https://www.w3schools.com/css/css_combinators.asp .
And for a working example, check out my work: https://www.frontendmentor.io/solutions/html-scss-toggle-without-js-g-y16l3KD (It's not the best tho!)
Marked as helpful
@abhineetkandele
Posted
@A-amon Thanks a lot. It really helped.
I have updated my solution using HTML & CSS only.
@A-amon
Posted
@abhineetkandele Glad to help!
@mmenghnani
Posted
This is amazing. Great work abhineet!
If I really had to nit pick something, I had 2 questions
Why did you choose a p tag for the price amounts? Like an h tag would have been better sematically? No?
How are you using the annual and monthly class?
Just curious, but otherwise I love the work
@abhineetkandele
Posted
@mmenghnani Hey, I am not an expert on accessibility but I did the solution based on my understanding.
Let me first ask you, what is the purpose of semantic header tags? We use them so that it is more readable to the screen readers by clearly defining the purpose of the element. And it helps the screen reader to easily navigate through the page.
But in this case, the price tag is not really defining any purpose. So, I preferred p tag over any heading tags.
Another point is that all the heading tags should be in order means that the h1 tag should be followed by h2 which should be followed by h3, and so on. And by seeing the size of the price tag, it should definitely be h1. But if we do that, it will be problematic to the screen readers.
Regarding the 2nd point, It is pretty clear in the code, you can check it out. If you have any other specific queries, I would be happy to answer them.
I hope I was able to help.
Looks Great!! Very nice job!! ⭐⭐⭐⭐⭐
@abhineetkandele
Posted
@palgramming Thanks for the appreciation!!
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord
