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

Mobile-First Workflow using SASS

Tin.Pham 250

@tin-pham

Desktop design screenshot for the Social proof section coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Feel free to give any feedback or ask any question ^ ^

Community feedback

@pikapikamart

Posted

Hey, good work on this one. The layout in desktop and mobile is good.

Suggestion/s would be that

  • Scrollbar. Upon loading your site, there is a scrollbar at the bottom. This was caused by the declaration of width: 100vw in your body tag. So fix this, simple remove that declaration.

  • Font size. Right now, your font-sizes are bigger compared to the original, thus creating some sections a lot bigger. So please consider resizing them so that it will be really good to look at.

  • Mobile state. In your mobile state, your h1 size does not really scaled well so it is really big right now. Scaling it down will be awesome. Also there is an appearance of scrollbar at the bottom, again. As I can see, you have a padding in your body tag right. Then every div inside one level deep have a padding again, which I think is not really necessary. Removing those padding of left and right will be awesome. Also removing the min-width of those div, and you can change them to take the whole width of the container. Since there is a padding from the body it will make sure that your content will not be touching the sides of the viewport.

Overall, you did a great job^

1

Tin.Pham 250

@tin-pham

Posted

@pikamart Oh thank you so much ^ ^. Very appreciate, I will fix these stuff

0

@Sahil-Yadav

Posted

Your top headers should be aligned left. Everything else is good.

0

Tin.Pham 250

@tin-pham

Posted

@Sahil-Yadav Thanks bro, i will fix this

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