Tagged: , ,

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • January 19, 2014 at 7:33 am #211872
    JPOsteen

    Hey guys, I’m trying to create a “DONATE” menu link that stands out like the picture below. Could you give me some tips? Thanks!

    http://loverescues.org/wp-content/uploads/2014/01/Screen-Shot-2014-01-18-at-11.25.48-PM.png

    My website is: http://www.LoveRescues.org

    January 19, 2014 at 9:40 pm #212006
    Yigit

    Hi JPOsteen!

    Please add following code to Quick CSS in Enfold theme options under Styling tab and adjust as needed

    li#menu-item-2583 a { color: black; }
li#menu-item-2583 { background-color: yellow; }

    You can target “donate” menu item using its ID which is 2583

    Regards,
    Yigit

    January 20, 2014 at 5:02 am #212096
    JPOsteen

    Yigit,

    Thanks for the help. I need a couple adjustments, though. I moved the link to the far right side of the menu and now the word “Donate” is not centered between the vertical borders. And the background color has a white border line underneath it. See picture below:
    http://loverescues.org/wp-content/uploads/2014/01/Screen-Shot-2014-01-19-at-8.50.55-PM.png

    How do I…
    1) Center the word “Donate” in the color background
    2) Extend the color background to cove the white lower menu border
    3) Add a hover color to the background

    Thanks in advance.

    January 20, 2014 at 5:34 am #212099
    Yigit

    Hey!

    Please add following code to Quick CSS as well
    1-

    #top .main_menu .menu>li:last-child>a { padding-right: 15px!important; }

    2-

    #header_main { border-bottom-style: none; }

    3-

    li#menu-item-2583:hover { background-color: blue; }
li#menu-item-2583 a:hover { color: white; }

    Regards,
    Yigit

    January 20, 2014 at 5:54 am #212101
    JPOsteen

    Yigit,

    So far, so good. One last thing… How do I keep the word “Donate” the same color as the Home page when actually on the Donate page?

    Thanks!

    January 20, 2014 at 2:30 pm #212204
    Yigit

    Hey!

    Please add following code to Quick CSS as well

    .header_color .main_menu ul:first-child > li#menu-item-2583.current-menu-item > a, .header_color .main_menu ul:first-child > li#menu-item-2583.current_page_item > a { color: white; }

    Cheers!
    Yigit

    January 21, 2014 at 4:35 am #212598
    JPOsteen

    Yigit,

    Thanks for such great support, it worked!

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Borders and hover colors in main menu…’ is closed to new replies.