
Landing page using CSS grid and Flexbox
Design comparison
Solution retrospective
I was unsuccessful with darkening the main window after a hamburger menu was active. Instead, I just used a light shadow on the left side, to make an illusion that the menu is put forward. Maybe someone would share their knowledge of how to implement that, which would be very helpful.
Community feedback
- P@visualdennissPosted about 2 years ago
Hello Renata,
very nice work with the challenge! It looks pretty good and also responsive.
Regarding background overlay, there are several ways you can achieve that. Basically you need an extra div or a container that contains the ul + the empty overlay div. You can add a new div for an overlay and give it a background color and make it fill the whole page and position it absolute. But adjust its z-index so its not covering the links with its container (ul).
You can find two different examples of how i implemented it: News Home Page or E-commerce Challenge. I'd suggest you to inspect the HTML Structure in the Browser Dev tools instead of the source code.
Hope you find this feedback helpful!
Marked as helpful1@An-RenataPosted about 2 years ago@visualdenniss Thank you for the suggestion. I managed to implement this. :)
1
Please log in to post a comment
Log in with GitHubJoin 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