Mobile Sticky Header & Increase Font Size

Comments

• Phil

  October 2022

  Hi,

  1) Do you have sticky header option enabled in Betheme -> Theme options -> Responsive -> Header?

  

  This option need to be also enabled in Betheme -> Theme options -> Header & Subheader -> Header.

  

  2) You want to increase the padding for what part?

  3) To increase font size you need to write a custom CSS code, and place it in Betheme -> Theme options -> Custom CSS & JS -> CSS. I can help you with it, but I will need a link to your website.

  
  

  Thanks

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• tiffitiff

  October 2022 edited October 2022

  Hello!

  1) I followed the steps you provided. I already had these options turned on and mobile header is still NOT sticky. See attached Theme Options:

  

  

  
  

  2) I'm referencing the padding on the mobile header. The logo is just a bit too close to the top and bottom of the background.

  3) Here's the link to our website - https://sidebaratl.com/ - I'll need help with writing the custom css code.

  Thanks!
• Phil

  October 2022

  1) The sticky header works on mobile, but it has a z-index lower than the content and it hides behind it. You have a custom CSS code that set the #Content z-index to 9999.

  

  

  Get rid of this CSS, and the Top bar will appear again.

  2, 3) Please, use the following CSS:
  @media only screen and (max-width: 767px){
     #Side_slide .menu-item span{
     font-size: 20px;
   }
     #Top_bar .logo #logo{
        margin: 10px 0!important;
     }
  }
  

  Best regards

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• tiffitiff

  October 2022

  Thank you the issue has been resolved.