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

Responsive blog preview card component using sass and css flexbox

P

@danielbasilio

Desktop design screenshot for the Blog preview card coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

I pride myself on good code organization, and on another occasion I would focus on implementing accessibility and some js framework

What challenges did you encounter, and how did you overcome them?

Using the Itcss methodology was a great challenge

What specific areas of your project would you like help with?

I believe that in the implementation and validation of the accessibility part

Community feedback

Kay 120

@kayy-w

Posted

Great work! This is a really good solution.

There's a few small errors that I can see:

  1. When you resize the window, the box jumps to the top of the screen. This may need to be looked at, there may be a media query here that needs amending.

  2. A very tiny error but 'published' should have a capital P.

  3. You asked for feedback about accessibility, I think the image could have a better alt text rather than 'Banner post' – this doesn't describe the image at all. A screen reader would read this out to a blind user and they wouldn't know what the image is. Try being more descriptive and adding some more detail there, perhaps something like 'A vector image of some lines and shapes on a yellow and white background'.

Everything else looks great, there's good attention to detail here and you've even changed the drop shadow on hover. Great solution!

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