Menu center vertical after making it bigger.

Comments

• Albert

  September 2015

  Hi Robin,
  
  you can control top margin with below css:

  .menuo-right #Top_bar .menu_wrapper { margin-top: 10px !important; }

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

  September 2015

  Hi Muffin,

  
  

  I tried your css but now when i scroll down it moves and when i want to select it the blue apears strange.

  
  

  Kindest regards,

  Robin
• Albert

  September 2015

  Ok. We did not noticed that you use sticky header before. To keep them the same in both, please use below css instead:

  .menuo-right #Top_bar:not(.is-sticky) .menu_wrapper { margin-top: 10px !important; }
  #Top_bar.is-sticky .menu_wrapper { margin-top: 25px !important; }
  #Top_bar.is-sticky .menu > li > a::after { bottom: -25px !important; }

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

  October 2015

  Thanks so much it worked like a charm! Is it also possible to get the blue underlining more to the bottom or just skip the underlining?

  
  

  
  
• Albert

  October 2015

  If you want to move blue underlining more to the bottom, you must use below css:

  .header-fixed #Top_bar .menu > li > a::after {
      bottom: -20px;
  }

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

  October 2015

  Thank you for you respond, because when i use sticky header it moves when scroll down and then the blue goes up again. What can i do to make this stay the same?

  
  

  
  
• Albert

  October 2015

  To do what you want, please use below css and this should help:

  .menuo-right #Top_bar:not(.is-sticky) .menu_wrapper {
      margin-top: 0;
  }
  .header-fixed #Top_bar .menu_wrapper .menu > li > a {
      padding: 30px 0;
  }
  
  .header-fixed #Top_bar .menu > li > a:after {
      bottom: 0;
  }
  
  
  
  #Top_bar.is-sticky .menu_wrapper {
      margin-top: 0;
  }
  #Top_bar.is-sticky .menu > li > a, #Top_bar.is-sticky .menu > li > a span {
      line-height: 30px;
  }
  #Top_bar.is-sticky .menu_wrapper .menu > li > a {
      padding: 30px 0;
  }
  #Top_bar.is-sticky .menu > li > a:after {
      bottom: 0 !important;
  }

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

  October 2015

  Hi Muffingroup,

  
  

  When i add this code it messes the menu up again. Also when i scroll down from top to center there is a strange jump in the page. How can i fix this?
• Albert

  October 2015

  It messes the menu up because you used a lot of own css's and also you modified some theme files. Some of the css's we gave you above, you may got already in your css section so you must compare them, and if you got the same css, you should replace it with our code instead. Or at least, go back to original theme files and do not use own css's that are doing this mess. But if you don't want to do that, then unfortunately there is nothing what we can do on our side, because with your current changes it is just impossible to do what you want.
  

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

  October 2015

  Hi Muffingroup,

  
  

  The only thing i want is a sticky header 90px high wich will scroll down the page. The menu must be centered and the buttons as big as the header offcourse. Is this possible without the hickup?

  
  

  The code i insert is what you gave me on top here can you make it work like i discribe please?

  
  

  Hope you can help

  
  

  Kindest regards,
• Albert

  October 2015

  Sorry but with current custom css it won't be possible. We spent to much time on your site trying to do this but it is just impossible.
  
  Thanks for understanding!
  

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