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

Blog-preview-card

OmarHafsa 120

@OmarHafsa

Desktop design screenshot for the Blog preview card coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

@nejidevelops

Posted

The solution effectively utilizes semantic HTML, incorporating appropriate tags such as divs and a footer tag. However, further optimization could involve minimizing the use of divs where possible to maintain semantic clarity.

Accessibility is well-addressed in the solution, ensuring inclusivity for all users.

Responsiveness is excellently implemented, with the layout seamlessly adapting to various screen sizes.

The code demonstrates strong structure, readability, and potential for reusability, fostering maintainability and scalability.

While the solution largely aligns with the design, there's a minor deviation observed in the padding and the height of the card. Adjusting the padding to closely match the design specifications would enhance visual consistency and alignment with the intended aesthetic. Implement the hover and active pseudo selector effects as it is a part of the requirements too.

Marked as helpful

1

OmarHafsa 120

@OmarHafsa

Posted

@mohammadnewton Thank you for the feedback provided, I will try to take it into consideration and correct my mistakes thank you again

1

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