Petey88 Petey88 - 7 months ago 36
CSS Question

Having Trouble With Max-Width Menu

I'm having trouble with the main menu in the header of my Wordpress site here:

The only way I can get it to fill the entire box is by declaring it to have a width of 950px. However, I want it to disappear when the user is on a mobile device leaving just the mobile menu.

My CSS looks like this, but it is not working:

@media screen and (max-width: 900px){#access {display:none;}}

Not sure how I can get it to collapse otherwise. Any help would be appreciated.


You just need to add the !important tag to your css, so that it overrides everything else. Like this:

display: none !important;

I tested this on your site and it worked.