Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • March 6, 2014 at 9:03 am #233100
    Breakstuff

    Hi,

    is it possible to highlight the menu instead of the smal red arrow?

    Actual is it like this:

    This is what I want

    Thank you

    March 6, 2014 at 3:00 pm #233193
    Ismael

    Hi Sven!

    You can add this on Quick CSS or custom.css:

    #top .main_menu .menu li:hover {
background: gray;
}

    Best regards,
    Ismael

    March 6, 2014 at 4:45 pm #233223
    Breakstuff

    Hi Ismael,

    Thanks for the quick reply.

    But I don’t want only the hover the selected menu item should remain gray.
    I hope you understand what I mean.

    March 6, 2014 at 4:49 pm #233228
    Yigit

    Hey!

    Please add following code to Quick CSS as well and adjust as needed

    .header_color .main_menu ul:first-child > li.current-menu-item > a, .header_color .main_menu ul:first-child > li.current_page_item > a { background-color: orange; }
.avia-menu-fx { display: none; }

    Regards,
    Yigit

    March 6, 2014 at 5:14 pm #233257
    Breakstuff

    Hi Yigit,

    thank you for the fast reply.

    Works great :)

    Is there a chance to change the hight of the menu?
    Now it hase the same size as the Logo.

    e.x. Logo should still be 88px (small fixed header) but the main menu should only be 30 pix in the center of the header.

    Is this possible only with css?

    Thank you

    March 6, 2014 at 5:16 pm #233260
    Yigit

    Hey!

    Which type of header are you using? You can check it in Enfold theme options > Header tab

    Cheers!
    Yigit

    March 6, 2014 at 6:01 pm #233302
    Breakstuff

    Header Type: small fixed header

    • This reply was modified 10 years, 9 months ago by Breakstuff.
    March 7, 2014 at 5:40 am #233591
    Ismael

    Hey!

    You can use this:

    .main_menu ul:first-child > li a {
line-height: 40px;
height: 40px;
}

#avia-menu {
top: 40px;
position: relative;
}

    Change the top value to move the vertical position of the menu.

    Regards,
    Ismael

    March 7, 2014 at 9:01 am #233651
    Breakstuff

    Hi, its not working.

    If I work with the dev tool of chrome the it looks like:

    .main_menu ul:first-child > li a {
    line-height: 40px;
    height: 40px;
    }

    page: wp.maier-sven.de (Test installation)

    March 7, 2014 at 4:08 pm #233771
    Yigit

    Hey!

    Please add following code to Quick CSS and adjust as needed

    #top .main_menu .menu>li:last-child>a { padding-right: 13px!important; }
#top .main_menu .menu li { margin-top: 30px; }
.main_menu ul:first-child > li > a { height: 40px; line-height: 25px; }

    Best regards,
    Yigit

    March 7, 2014 at 4:18 pm #233785
    Ismael

    Hey!

    Please give us a link to the actual website. Add !important on the css values:

    .main_menu ul:first-child > li a {
line-height: 40px !important
height: 40px !important;
}

    Best regards,
    Ismael

    March 7, 2014 at 6:32 pm #233896
    Breakstuff
    This reply has been marked as private.
    March 7, 2014 at 7:10 pm #233910
    Josue

    Hi,

    Can you post the link to your website please?

    Regards,
    Josue

    March 7, 2014 at 7:14 pm #233913
    Breakstuff

    Strange I posted before but now its deleted.

    here we go again: http://wp.maier-sven.de/

    March 8, 2014 at 11:11 am #234131
    Breakstuff

    Thank you for your great support.

    I have made some CSS test and now I have found a solution that is great for me.

    This topic can be closed.

  • Author
    Posts
Viewing 15 posts - 1 through 15 (of 15 total)
  • The topic ‘How to highlight the actual menu page’ is closed to new replies.