Skip to content
Submitted about 2 years ago

Blogr Landing Page with CSS Grid

accessibility, sass/scss
kxnzx•870
@kxnzx
A solution to the Blogr landing page challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Hello Frontend Mentor community,

Does anyone know why my menu (in the Mobile View) does not display when the toggleButton has been clicked? How can I fix it?

Your help is much appreciated!

Code

Please log in to post a comment

Log in

Community feedback

  • Chris•520
    @9CB5

    The display: none in .menuList takes precedence over the .displayMenu class that you toggle when you click the button. So the menu will never show. There are two ways you can solve this:

    1.) Hacky but quicker way. Add an !important keyword to display: block inside the .displayMenu class. But bear in mind this is bad practice as you're bypassing the natural order of precedence of your CSS.

    2.) Modify the display: none in .menuList using JS with something like menu.style.display = "block" when the hamburger is clicked.

    Marked as helpful

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