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

Css tutorials

@Lizzietrust

Desktop design screenshot for the Agency landing page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


There was no design for the mobile menu so I couldn't do that part, any suggestion on how to go about it please?

Community feedback

@C-Schubert94

Posted

The solution looks pretty good! The contact needs to be a button not just a link (which is an easy fix). For the hamburger menu the way I went about it was I took the links and button and put them in their own container and made them flex-direction: column; so they'd be under the logo and the hamburger menu. Now the CSS for the container needs to be display: none; in the media query so it initially doesn't show them. After that, using JS you'll create a class that will toggle on and off for the container so it will display. What I mean by that is you'll have a class (let's say .open) that the JS will add to the HTML and that class changes the display to display: flex; so the menu shows and goes away when you click the hamburger. I hope this helps!

0

@Lizzietrust

Posted

@C-Schubert94 Ok thank you, I’ll readjust

0

@Lizzietrust

Posted

@C-Schubert94 Ok thank you, I’ll readjust

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