@isprutfromua
Posted
Hi there. You did a good job 👍
keep improving your programming skills
your solution looks great, however, if you want to improve it, you can follow these steps:
🟢 add some alternative text to images
🟢 avoid using double images. It's better to use picture tag with sources
🟢 there is no reason to positioning top image absolutely. You can simply use flexbox, or fix the height of container and set background-image. You card will be more responsive.
🟢 about buttons: all is right, you can check it with browser accessibility tools. One thing that I'll be added it's more descriptive text for the change button (with sr-only class).
I hope my feedback will be helpful
Good luck and fun coding 🤝⌨️
Marked as helpful
@OGShawnLee
Posted
@isprutfromua Hey thank you very much for the feedback.
- You're right. I will add alt text to the icons.
- I actually implemented your advice in one of my recent challenges. Thank you very much. I will update this one with the picture tag.
- Do you mean the background image? I don't know, it was quite easy to get it positioned with absolute + inset 0. Or do you mean the image of the girl? It is not absolutely positioned, the container is a flex column.
- Yep. You are right. I will add a label with sr-only.
Thank you very much Ivan. Good luck to you as well!
@isprutfromua
Posted
@OGShawnLee I am glad that my help was useful to you
Cheers, peace and happy coding!
