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

I used HTML , CSS and BOOTSTRAP-5 to complete this awesome challenge

@saurabh222132

Desktop design screenshot for the News homepage coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hello there! This is my first project in the way of learning web development. In this project, I did everything properly for the desktop site but get difficult to make a side-growing navigation bar when it is on a mobile screen. overall it has been a great experience to complete such a challenge and hopes to learn a lot.

Community feedback

Maxime 430

@maxime927

Posted

Hi Saurabh, Hope you are fine !

First, congratulations to have done this challenge.

I have some tips to help you to improve your progress and this solution:

  • Concerning spacings, you should pay attention to alignement of content and vertical spacings to let the content breathe

  • Concerning your blocks, you should use the constructor class to wrap your real blocks and don't consider that the <div class="col-4"> , for exemple, is the wrapper, because it causes issues for exemple with you mobile navigation. each time, put a div in the <div class="col-x"> tags

  • I can advise you to use the chrome extension PerfectPixel as well, I advise this extension a lot to help you to compare your solution with the design file and add some adjustments to be the closer to the design.

  • At last but it's a little thing, you forgot the links on the news and the cards at the bottom section :)

Keep going in that way!

Hope it helps

Maxime

Marked as helpful

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