Mobile menu not showing up depending on width

  • shaunshaun

    (@shaunshaun)


    2 years ago

    Hi. On a computer my menu appears at the top.
    On a cellphone there’s the three lines and the word Menu.

    That’s fine.

    But with a device that has a screen width wider than a phone but narrower than a computer, there’s no menu at the top and no menu bar like for a cell phone.

    Somewhere there must be a setting that defines the width at which the regular menu disappears, and another setting for where the mobile menu kicks in. And they should be the same. But I can’t find them.

    I tried both with and without the Mega Menu plugin. No difference. Their documentation talks about the responsive breakpoint but I don’t know where to find that in the Virtue theme.

    I do have this line in my css that I think you gave me for something:

    @media (min-width: 992px) {
    .col-md-4.clearfix.kad-header-left {
    display: none;
    }

    I tried changing the 992 to a much smaller number but it didn’t help.

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)
  • hannah

    (@hannahritner)

    Hey,
    Thanks for reaching out! I’m not sure why this ins’t showing fluid. It could be a conflict with another plugin.
    This css should resolve:

    @media (max-width: 992px) {
.nav-trigger .nav-trigger-case {
    position: static;
    display: block;
    width: 100%;
}
}

    Hope that helps!

    Best,
    Hannah

    Thread Starter shaunshaun

    (@shaunshaun)

    Thanks, but that fixed one problem and created another. That moved the menu halfway to the right so it now requires two lines.
    (I changed it back)

    FYI my css had, at the top,
    `@media (min-width: 992px) {
    .col-md-4.clearfix.kad-header-left {
    display: none;
    }
    .col-md-8.kad-header-right {
    width: 100%;
    }
    }
    (I took out the top half when I put in your css, but with it or without it, same problem)

    Thread Starter shaunshaun

    (@shaunshaun)

    FYI not a plug-in problem because I tried de-activating all of them and it didn’t fix the problem.

    hannah

    (@hannahritner)

    Hi Shaun,
    Sorry for the delay. Did you try adding the css I provided while keeping in your CSS? Your css only has effect if the screen is larger than 992px and mind would only have effect if the screen is smaller than 992px. Let me know if it works with both snippets.

    Kindly,
    Hannah

    Thread Starter shaunshaun

    (@shaunshaun)

    I had tried it and it pushed the menu to the right (as I mentioned above).

    But now it seems to be working again with your code. I wonder if where I placed the code made any difference. I had also made some other changes. Maybe that made a difference. Anyway, seems to be working okay now. Thanks!

    FYI Still trying to find a reason to be in Montana so I can come perform for your company!

    hannah

    (@hannahritner)

    Glad to hear things are working!
    Ha, yes! Let us know!

    Best,
    Hannah

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Mobile menu not showing up depending on width’ is closed to new replies.