Design comparison
Solution retrospective
Testimonials grid section👨🏽💻
Technologies used 🚀✨
- HTML🏗
- CSS️🎨
Features 🎯
- Semantic Arrangement✨
- Dynamic Animations🎭
- Prettier Arrangement🌈
You can check me out
Ready to tag along on my coding escapades? Join my adventure, where I challenge projects here.
🌌 Feel free to add your opinion about any possible improvements to the code and accessibility. 🙃
Community feedback
- @petritnurediniPosted 10 months ago
Congratulations on completing the Testimonials Grid Section project! Here are some recommendations to further improve your code:
- Accessibility: Ensure all images have appropriate alt attributes for screen reader users.
- Consolidate Styles: Consider consolidating repetitive CSS styles to improve maintainability and reduce redundancy.
- Responsive Design: Test your project on various screen sizes and optimize layout and typography for smaller devices.
- Semantic HTML: Use semantic HTML elements like
<header>
,<main>
,<section>
, etc., to enhance the structure and accessibility of your code.
Keep up the fantastic work! Consistent practice and learning will help you excel as a front-end developer.
For further learning, check out these resources:
0 - @Naveen-CBPosted 10 months ago
Hello @iamupo, your solution looks good but I have notice one issue with you code.
In your card-5 section you did some mistake that make it to overflow at some viewport width:
@media (min-width: 1200px) { .card5 { grid-column: 4; grid-row: 1/4; } }
Instead try this :
@media (min-width: 1200px) { .card5 { grid-column: 4; grid-row: 1/3; } }
Other than this your solution looks good and I especially like that 2 column for tablet size.
I hope this might be helpful to you❤️
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
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