Exclude a menu item from collapsing in mobile view

  • Hello! I can’t seem to find a solution anywhere for this. Hoping someone here can help.

    I have a horizontal navigation menu with the usual “Home” “About” “Contact” etc menu items all floated to the left of the nav bar. I then have a “My Account” menu item floated to the right of the nav bar by itself.

    Upon screen breakpoint (992px) all of the nav menu items collapse under a hamburger icon.

    So in mobile view, I only have 2 icons available – a house (for homepage) and a hamburger icon (lists all the nav items that were collapsed).

    What I’m trying to do is to tae that “My Account” menu item and keep it visible on the nav bar in mobile view. I want to keep everything collapsed under the hamburger icon EXCEPT “My Account” which needs to be visible on the nav bar even in mobile view.

    Can someone please give me some guidance on how to do this?

Viewing 1 replies (of 1 total)

  • Hi kosmicbird. You could create another “My Account” menu item like Home and float it next to the Home icon. Use CSS to set that item display:none by default, then set a media query max-width:992px and set display:block.

Viewing 1 replies (of 1 total)
  • The topic ‘Exclude a menu item from collapsing in mobile view’ is closed to new replies.