Header height on mobile - settings and is logo padding possible

tadej4 · September 4

I wanted to adjust header height on mobile view.

I tried setting header hight in Responsive/Header.

There was no effect if value was set here. There was also no effect if I set Height under theme options - Header & Subheader/Heade/Layout.

Is there any other way to change header height? Is it posible to add padding around logo in header?

Phil · September 4

Hi,

Try the following CSS code:

@media only screen and (max-width:767px){
 #Top_bar .top_bar_left .logo{
  padding: 20px 0;
 }
 #Top_bar .top_bar_left .menu_wrapper .responsive-menu-toggle,
 .mobile-sticky #Top_bar .top_bar_left .menu_wrapper .responsive-menu-toggle{
  top: 50px!important;
 }
}

Put it in Betheme -> Theme options -> Custom CSS & JS -> CSS.

Best regards

tadej4 · 10:14AM

Thanks this works great. I would also need to adjust logo size (height/width) in mobile view and also in other views. How can I adjust that? Is there an option in theme options or via custom css?

Phil · 12:02PM

With many customizations, we highly recommend using the Header Builder, so you can create any header you want:

https://support.muffingroup.com/video-tutorials/header-builder-2-0/

https://support.muffingroup.com/video-tutorials/building-mobile-headers/

Best regards

Header height on mobile - settings and is logo padding possible

Comments