CODEWITHSUNDEEP
htmlcssheadershopifyhamburger-menu
Remo
Remo

Reputation: 19

Hamburgermenu not showing after clicking on the icon. What can I do?

I ran into a problem as I tried to use the hamburger-menu not only for mobile but for all devices with max 1100px. I am using the shopify debut theme. At first everything went fine. I saw the hamburger-menu and could click on it. But as soon as my window has a pixelcount of 750 to 1100 I can click on the hamburger icon, but nothing shows up. This looks like this (between 750 and 1100px). Instead it should look like this (below 750px).

I already changed the @media only screen and (max-width:750px) to the 1100px and the @media only screen and (min-width:749px) to 1099px inside my theme.css for pretty much every header class. Which made the hamburger icon show up. But now I hit a roadblock. I don't know what I am missing here.

Any help is greatly appreciated. Thanks!

Just in case you need any of these:

My Website URL: www.snow-pearl.com (without any chances to the @media because it is the live version and I dont want to publish something that is not working)

Here is the edited theme.css file (with changes). Here is the used theme.js file. Here is the edited header.liquid file.

Upvotes: 0

Views: 669

Answers (1)

Jyoti Ahluwalia
Jyoti Ahluwalia

Reputation: 51

The reason why your hamburger isn't showing is due to line number 800 in theme.css

@media only screen and (min-width: 750px){
    .medium-up--hide {
        display: none !important;
    }
}

Upvotes: 1

Related Questions