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

Responsive homepage using CSS media query

Tawakalt 120

@Lahitan

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


I found using media queries difficult as it was my first time using it

I am unsure about the toggle part where I used JavaScript, it's new to me.

I am open to critisim cause it helps me improve.

Community feedback

P

@mihalymarcell86

Posted

Hi @Lahitan,

I think your project turned out pretty well, provided that some of the techniques required were new to you. I would only point out a couple of things:

  • if you shift the menu drawer out of view, like you did, make sure the user can't scroll sideways to reveal it. You can use overflow-x: hidden to achieve this.
  • try to make sure, that the page layout looks fine at every screen size. You need to make some adjustments around 750px width, so that the content doesn't break that much
  • for better accessibility, use semantic HTML elements (<main>, <footer>, <nav>)

Keep up the good work!

Marked as helpful

0

Tawakalt 120

@Lahitan

Posted

@mihalymarcell86

Thanks a lot🙂 I would make necessary adjustments

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