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

Dropdown navigation

retr0web 250

@retr0web

Desktop design screenshot for the Intro section with dropdown navigation coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

I was able to animate dropdown menu on desktop, but couldn't do it on mobile, because list items wouldn't fold to 0px height (due to sag icons). It would be possible if I could animate display: none, but that is not widely supported yet :)

What challenges did you encounter, and how did you overcome them?

Mainly with the architecture for menu and how to make it slide-in-out, and getting the vertical picture right for desktop (not making it distorted)

What specific areas of your project would you like help with?

I would appreciate an advice on a way to do animation for dropdown menu for mobile (keep in mind that the nav element is one for both desktop and mobile, so no additional or secondary menu for mobile)

Community feedback

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