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

New Homepage HTML CSS

@NoahRod108

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


Any feedback is welcome!

Community feedback

S MD suleman 3,530

@sulemaan7070

Posted

hey Noah Rodriguez😄, here are a few tips to make your site better...

1.I see that you have applied only the desktop-image on both the desktop and the mobile versions.. you will find the image-web3-mobile in the images folder.. you can responsively change the image based on the media-query...

2.I recommend you to use the picture element to change image based in media-query. more about picture element here📚

3.You can add hover effects on many texts as you can see in the active state image in the design folder...

4.The margin and padding on the nav-bar for the mobile version seem a bit much you can reduce that.

5.When I am opening the mobile-menu and start to scroll down the x or the close svg is going upside.. you can remove scroll behvaiiour with the help of JS.. let me know if you need further help..

Hope that helps,Happy coding👍🏻💯

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