Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Four Card Feature Section using html and css

faekhatami 540

@faekhatami

Desktop design screenshot for the Four card feature section coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

haquanq ®️ 1,585

@haquanq

Posted

Hello @faekhatami 👋👋

Nice work on the challenge, the solution look similar to the design.

Here is my opinion on what you can improve:

  • Page must have one main landmark (other landmarks here) which means you should wrap your most important content of the page inside main.
  • Avoid using div and use more semantic HTML markups such as article, ul, li, blockquote, figure, legend,.... For example each card can be wrapped inside a article or related content such as a group of cards can be used with ul, li to provide it more semantic as it represents a list of item (having the same context)
  • Consider add more breakpoints for your media queries to make the page more responsive (your page layout shifting is a bit rushed and too much). You can check out my solution for this for more references.

Hope this help, have nice day and happy coding 😁😁

Marked as helpful

1

faekhatami 540

@faekhatami

Posted

thank you for your comment it was so helpful 😊 i will consider them in my next practices! 🌸🙌🏻 @haquanq

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join 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