Responsive menu on iPad

  • Resolved adrianmroberts

    (@adrianmroberts)


    5 years, 2 months ago

    The responsive menu shows a “hamburger” icon for the menu below the header. This is fine on phones, but on iPad, it would seem sensible to show the full text of the menu items, as on desktop. Is this customisable?

    Thanks.

Viewing 4 replies - 1 through 4 (of 4 total)
  • blossomthemessupport

    (@blossomthemessupport)

    5 years, 2 months ago

    Hi @adrianmroberts,

    Can you please provide me your site link so that I can look into your requirement further?

    Thread Starter adrianmroberts

    (@adrianmroberts)

    5 years, 2 months ago

    Thanks. It is rangitoto.co.uk Please note it is in early development, so you may see strange things coming and going 🙂

    blossomthemessupport

    (@blossomthemessupport)

    5 years, 1 month ago

    Hi @adrianmroberts,

    You can use the below CSS code to show the extended menu in small screen sizes:

    @media screen and (min-width: 768px) and (max-width: 1024px) {
    .main-navigation button.toggle-button {
    display: none;
    }
    .main-navigation .primary-menu-list {
    display: block;
    position: unset;
    background: unset;
    height: unset;
    width: unset;
    z-index: unset;
    padding-top: unset;
    overflow-y: unset;
    text-align: unset;
    box-shadow: unset;
    }
    .main-navigation .close-main-nav-toggle {
    display: none;
    }
    .main-navigation .primary-menu-list .mobile-menu {
    width: unset;
    }
    .main-navigation ul li {
    display: inline-block;
    }
    .main-navigation ul li a {
    border-bottom: unset;
    }
    .main-navigation ul li.menu-item-has-children .submenu-toggle {
    top: 50%;
    transform: translateY(-50%);
    width: 10px;
    height: 17px;
    }
    .main-navigation ul ul {
    position: absolute;
    }
    }

    Thread Starter adrianmroberts

    (@adrianmroberts)

    5 years, 1 month ago

    Thanks very much for your help. It works perfectly.

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Responsive menu on iPad’ is closed to new replies.