Responsive Header Menu

Hi,

I was wondering how the theme defines it’s responsive behaviour when it comes to the header. In a normal browser full-screen the top menu is displayed as follows:

Once you minimize the screen size at some point the top menu will change:

I created a floating menu that I want to always appear at the time when a screen is displaying the second version of the header menu since that version is not sticky. I have tried following code:

    @media screen and (min-width: 1127px) {
      .buttonizer-group-0-0-1 {
        display: none !important;
      }
    }

However, depending on the device and browser used, the pixel number when the header menu changes seems to vary. What code would make the above element display depending on which header menu version is being displayed?

Thanks!

Sven

Is there anyone who knows this?

Hi,

​Please accept my apologies for the delay in response. I really appreciate your patience.

Sorry, I couldn’t get your query clearly. Can you share links to the pages you need help with, so I can inspect and perhpas it would help me better understand it?

@media screen and (min-width: 1127px) {
  .buttonizer-group-0-0-1 {
    display: none !important;
  }
}

To what page are you applying this code? Can you share its link?

Regards,
Kharis
aThemes Support

Hi Kharis,

I am applying the code to this side: www.qreativraum.de

I am trying to achieve that the menu button on the bottom right appears, disappears, and reappears in sync with the header menu style change on any device/browser. Is this possible? Note: The menu button is only visible after scrolling down some on the page. It should appear in sync with the scroll-top button that is build into this theme.

Thanks!

Sven

Hi Sven,

Thank you for updating me.

If I could get it right, you’d add the below CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (max-width: 1024px) {
        .site-header,
        .site-header.fixed {
          position: fixed !important;
        }
    }

Regards,
Kharis
aThemes Support