Menu text overlaps page text when scrolling. How to change menu bkgd or get rid of it, on scroll?

edited March 2015 in Menu / Mega menu

1. Go to athomeqc.com
2. Scroll down the page.

You'll notice the menu pop up at the top as you scroll down. The grey menu text overlaps over the page's text & it looks quite unprofessional.

- How do I give the menu a white background instead of a transparent background, when scrolling?
- How do I get rid of the menu from showing during scroll, altogether?

Thanks.

Comments

  • Hi,

    you use too many menu items for 960px grid. So or you will move some items under submenus or you will use below css:
    #Top_bar .menu > li > a span:not(.description) { padding: 0 10px; }
    Also you can change grid to 1240px and everything will be fine as well.
  • How do I change grid to 1240px? 

    thanks.
  • Also, there is this thin grey line that is a separator between the menu items, how do I get rid of that ?
  • 1240px grid can be activated under Theme options > Layout > Header section when you will deactivate 960px grid. But to remove separator between menu items, please use below css:
    #Top_bar .menu > li > a span:not(.description) { border: 0; }
Sign In or Register to comment.