
Design comparison
Community feedback
- P@TempperPosted 2 months ago
Your code is overall well structured and easy to follow. The HTML elements are used appropriately, and the comments help clarify your intent. One important improvement is to include an alt attribute for your image element to support accessibility. The meta tags are useful, but adding a meta description could further improve SEO.
The inline CSS is clear, although for larger projects it might be better to use an external stylesheet. Using fixed dimensions (like the container’s width and height) works for this challenge, but it might cause issues on different screen sizes; consider using responsive units or media queries in the future.
In your CSS, you use the gap property on the “.box” class, but since this element isn’t set to display as flex or grid, the gap won’t have any effect. You may want to set “display: flex;” or “display: grid;” on that container if you intend to use gap for spacing.
There is also a minor markup issue—the attribution div isn’t closed properly, which could lead to unexpected rendering or validation errors. Ensuring that all your elements are properly closed will help maintain consistent behavior across browsers.
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