Mies theme Menu

• 

  thewholeschool · Member · Jan 13, 2015 at 4:33 am

  • Copy link
  • Add topic to favorites

  Hi there,
  I need help with my themes menu. The drop down currently covers the main navigation instead of dropping under it. This makes it impossible to view the pages that are on the main navigation if they have sub menus. Also this is making it so that the current navigation is not responding to each sub menu button uniquely. When the current page you’re on is part of a sub menu, that sub menus is styled different from the other sub menus. Help!

  The blog I need help with is: (visible only to logged in users)

• 

  nizamilputra · Member · Jan 13, 2015 at 4:50 am

  • Copy link

  Hi there,

  If you’ve already knew how to work with css, then try to add this code;

  .main-navigation ul ul{
    top: 4.3em;
    left: auto;
    background: none;
  }

  When the current page you’re on is part of a sub menu, that sub menus is styled different from the other sub menus.

  main-navigation li.current_page_item .sub-menu a,
  .main-navigation li.current-menu-item .sub-menu a{
    background-color: #FF6956;
    color: #fff;
  }

  I hope it will helps you.

• 

  thewholeschool · Member · Jan 13, 2015 at 11:11 pm

  • Copy link

  Hi that did help but not entirely. Still when you’re on a page from a menu and you go to hover over that sub menu- the page buttons dont give individual hover style. Like if you’re on the about page and hover on the sub menu, you’ll notice that the individual buttons dont change like the other menus would. Can you help with this also? The other stuff you helped with has been great! Thank you. Also I said this theme is Mies but it is actually Motif.

• 

  thewholeschool · Member · Jan 13, 2015 at 11:13 pm

  • Copy link

  oh yeah, and one more thing: my header banner has a blue line on the right side, how can I get rid of this?

• 

  nizamilputra · Member · Jan 14, 2015 at 11:03 am

  • Copy link

  Lets try to add this css;

  .main-navigation ul > li.current_page_item > a,
  .main-navigation ul > li.current-menu-item > a,
  .main-navigation ul > li.current_page_ancestor > a,
  .main-navigation ul > li.current-menu-ancestor > a{
      background-color: #fff;
  }
  
  .main-navigation ul > li.current_page_item > ul a,
  .main-navigation ul > li.current-menu-item > ul a,
  .main-navigation ul > li.current_page_ancestor > ul a,
  .main-navigation ul > li.current-menu-ancestor > ul a{
      background-color: #FF6956;
      color: #fff;
  }
  
  .main-navigation ul > li.current_page_ancestor > ul > li.current-menu-item a,
  .main-navigation ul > li.current-menu-ancestor > ul > li.current-menu-item a{
      background-color: #fff;
      color: #3b6070;
  }
  
  .main-navigation ul > li.current_page_ancestor > ul > li a{
      padding: 1.0849em;
  }
  
  .main-navigation ul > li.current_page_ancestor > ul > li a:hover{
      padding-left:10px;
      background-color: #fff;
      color: #3b6070;
  }

• 

  nizamilputra · Member · Jan 14, 2015 at 11:06 am

  • Copy link

  oh yeah, and one more thing: my header banner has a blue line on the right side, how can I get rid of this?

  Your image has less width than container, 1140px. You can use this css to make it full fill the container;

  .site-image img{
    width: 100%;
  }

• 

  thewholeschool · Member · Jan 15, 2015 at 8:07 pm

  • Copy link

  nizamilputra you’re awesome, thanks for all the help.
  the css worked for my banner problem terrific but the menu problem still persists!

  any other ideas?

• 

  nizamilputra · Member · Jan 16, 2015 at 1:10 am

  • Copy link

  How about add this code?

  .main-navigation ul > li.current_page_item > ul li a,
  .main-navigation ul > li.current-menu-item > ul li a{
      padding: 1.0849em;
  }
  
  .main-navigation ul > li.current_page_item > ul li a:hover,
  .main-navigation ul > li.current-menu-item > ul li a:hover{
      padding-left: 10px;
      background-color: #fff;
      color: #3b6070 ;
  }

• 

  thewholeschool · Member · Jan 18, 2015 at 7:55 am

  • Copy link

  perfect! you’ve been a huge help, thank you nizamilputra