Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • January 20, 2014 at 1:16 pm #212191
    sgkeil

    Hello there!
    First off, great theme, thanks ;)

    Just like this topic, I wanted the last menu item to look like a button. I followed the advice on the post, and it worked great… but…
    https://kriesi.at/support/topic/header-menu-button/#post-176950

    There’s one difference – I *just* want the last word (MDB Portal Sign in) to be green, but NOT the drop-down menu’s that are under it. The site link is here: http://www.sciant.com

    Is there a way to
    a) keep the button over “MDB Portal Sign in”, but NOT have it on the drop-down menu items? (e.g. to have “beta registration,” “sign-in,” and “help desk login” to be theme-standard?
    b) not have the red underline on:hover effect when you hover over the green MDB portal “button”?

    Thanks so much!
    Steve

    January 20, 2014 at 2:45 pm #212214
    Yigit

    Hi sgkeil!

    Do you mind creating a temporary admin login and posting it here privately so i can take a look?

    Cheers!
    Yigit

    January 20, 2014 at 4:59 pm #212321
    sgkeil
    This reply has been marked as private.
    January 20, 2014 at 5:18 pm #212331
    Yigit

    Hey!

    Changes are done, please review your website. You can find custom CSS code i added in Quick CSS section in Enfold theme options. I have modified the code you have added to make menu item into a button a bit to apply only on parent item.

    Best regards,
    Yigit

    January 20, 2014 at 8:56 pm #212416
    sgkeil

    Wow, thanks! Looks great!! Juuust one little thing..
    Now when I scroll, the “button” dips down below the rest of the menu items. I had this issue before, and the following code helped it:

    .header-scrolled li#menu-item-2756 a {
    margin-top: 7px;
    }

    but now that doesn’t seem to work?
    Any thoughts?
    Thanks!
    Cheers,
    Steve

    January 20, 2014 at 9:00 pm #212420
    Yigit

    Hey!

    Please try adding !important rule to force it

    .header-scrolled li#menu-item-2756 a {
margin-top: 7px!important;
}

    It should work

    Regards,
    Yigit

    January 20, 2014 at 9:25 pm #212433
    sgkeil

    Oh, that worked! Great, thanks again!

    If anyone else is interested, the code is below (easy to change the color, just swap the rgb (x,y.z)). Also make sure you get the right ID for your menu item (inspect the item).
    Here is the CSS:
    ——————

    #menu-item-2756.avia-menu-fx { display: none; }
    .header_color .main_menu ul:first-child > li#menu-item-2756 > a {
    padding: 5px 10px;
    background-color: rgb(9, 70, 17)!important;
    color: white!important;
    height: 30px!important;
    line-height: 20px!important;
    margin-top: 28px;
    border-radius: 10px;
    border-width: 0px;
    }

    .header-scrolled li#menu-item-2756 a {
    margin-top: 7px!important;
    }

    .header_color .main_menu ul:first-child >li#menu-item-2756 > ul { border-top: none; }

    li#menu-item-2756 .avia-menu-fx { display: none; }

    January 20, 2014 at 9:38 pm #212438
    Yigit

    Hey!

    You are welcome! Thanks for sharing your code

    Regards,
    Yigit

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘header menu button – drop down question’ is closed to new replies.