Design comparison
Solution retrospective
Hello!
I had trouble figuring out how to style a dark slightly opaque background on the screen when the mobile side menu opens. Any assistance on how to style that would be very helpful. Please also give me any other feedback on my project! I'm very proud of my work, but I know there is still room for improvement :)
Community feedback
- @Daniel-BilodidPosted over 1 year ago
Hi, my congratulations you did a great job ๐
๐๐จ๐ฆ๐ ๐ญ๐ข๐ฉ๐ฌ ๐๐จ๐ซ ๐ฒ๐จ๐ฎ๐ซ ๐๐จ๐๐ ๐
๐น You need to put a landmark in your code
simply wrap your code with <main> landmark
๐ The <main> HTML element is intended for the main content (content) of the <body> of the document (page).
I hope it was helpful, you are great, keep up the good work ๐
Marked as helpful1 - @MooseCowBearPosted over 1 year ago
You can add a parent div to your mobile menu that has a width and height to cover the window, and add a background color to it. As in this explainer.
Also, I don't know if this is what you intended but the media query to switch to the desktop layout is quite large. Mobile devices tend to be around 400-ish px wide. The iPhone 14, for instance, is about 430px.
Marked as helpful1
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