Sticky banner is not full width

Comments

• Albert

  December 2015

  Hi,
  
  looks like it's due to your custom css. Please remove custom css responsible for header and then check.
  

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

  December 2015

  Hi,
  
  I put some css in to align the menu to the center:
  
  #Top_bar .menu_wrapper {
  text-align: center;
  width: 100%;
  }
  
  #Header .menu > li {
  display: inline-block;
  float: none;
  }
  
  #Top_bar .top_bar_left {
  width: 100% !important;
  }
  
  This is the code that will center the menu, but it also triggers the sticky menu to not show properly.
  Do you have a solution to align the menu and also show a proper working sticky menu?
  
• Albert

  December 2015

  If above css works only for main menu, you supposed to use additional class for the #Top_bar element. So the css should look as below:

  #Top_bar:not(.is-sticky) .menu_wrapper {
      text-align: center;
      width: 100%;
  }
  
  #Header .menu > li {
      display: inline-block;
      float: none;
  }
  
  #Top_bar:not(.is-sticky) .top_bar_left {
      width: 100% !important;
  }

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

  December 2015

  Ok thanks! It works!
  But it is not possible to align the sticky menu in the center?
  The normal menu aligns in the center and the sticky menu at the left. I want both in the center.
  
• VisionArt_DenBosch

  December 2015

  Also, te sticky responsive menu isnt working on a tablet? Ipad.
  Does that also have to do with css?
  Thanks!
  
• Albert

  December 2015

  Sticky menu does not work on tablets because is simply incompatible. But to center menu items in sticky header, please use below css:

  #Top_bar.is-sticky .menu_wrapper {
      text-align: center;
      width: 90% !important;
  }

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