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 with statemanagement and RWD

@yahappylemon

Desktop design screenshot for the Article preview component coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

P
Nico 330

@Nico243

Posted

Using semantic tags like header, main and footer is a good practice for our HTML's overall structure.

I see you used SASS, how did you experience that?

usage of global reset helps cross browser consistency in rendering the elements. I forgot about this and will remember it next time!

I see a redundancy with .left {}, after we code something new we sometimes loose track of what we already added, keeping everything in order working from top HTML to down helps me avoid this one, but it can still happens to the best of us.

It just needs minor updates,

You've done a great job on this.

Marked as helpful

0

@yahappylemon

Posted

@Nico243 Thank you for your advice!

Actually the .left was for the image since I used background-image to place the photo instead of using <img> (though it's truely confusing and I should avoid that next time! lol)

In my opinion SASS can be really useful in bigger projects, since you can declare varibles and write nested classes, but I think there's no big difference between using SASS and vanilla CSS in this challenge.

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