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

Article Preview Component

Bobby Sā€¢ 340

@bobbe86

Desktop design screenshot for the Article preview component coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Flexbox worked well with this challenge. I did not think about using grid which may have worked better in terms of responsiveness. I am always curious about best practices for media queries, breakpoints and responsive design. I usually set a max or min-width and change things from there. I could not get the fill of the button sag image to change on the clock so I made a copy for the pop up with a different fill. Other than that, I think this turned out great! Thanks for any feedback :)

Community feedback

Yves MUHOZAā€¢ 170

@hozayves

Posted

Hello brother, It's awesome for completing this challenge

I've suggestions on how your HTML structured

  • footer came at end not inside the <main></main>

make sure you follow these best practices

    <head></head>
    <body>
       <header></header>
       <main></main
       <footer></footer>
    </body>
</html>

Keep up
0
Nikola Dā€¢ 1,450

@NikolaD93

Posted

Hello there! šŸ‘‹

Congrats for completing the challenge!

šŸ™Œ I have 2 suggestions for you:

1.Make sure to provide tag at the bottom, just before the ending <body><body/> tag.

2.Put all the images and icons in one folder named images or assets.

Hope this was helpful for you, if it was mark it as helpful šŸ™

Have a nice one! šŸŽ‰āœŒ

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