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

gjrestifo 20

@gjrestifo

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 am getting more comfortable with sketching out the structure of HTML code and setting up the proper architecture from the Figma files.

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

I had to figure out how to use flex containers and gaps to properly separate items.

Community feedback

P

@bmeinert8

Posted

Your finish product looks great, you nailed the desktop version of the design. A few things I noticed from the design that are missing that you may go back in and add if you'd like.

  1. The first thing I noticed missing was when hovering over the page the box shadow hover effect was not present such as in the design.
  2. Another missing piece I noticed was also with the hover effect. You had the main title text change color, which is excellent, but the cursor did not change to a pointer.
  3. There are some very slight changes to sizing in the font and container itself from the desktop to the mobile version of the challenge that I didn't see.

Again, these are just things that I noticed, and you don't need to go in and make these changes if you don't want to. All and all I think you did a great job! Your code looks good and the design looks right. Keep up the good hard work my friend :)

0

@tasosbeast

Posted

good job ! you have a bit more margin on date and on title but overall good job

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