Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • November 13, 2013 at 9:18 pm #188004
    RDCSI

    Hello,

    I am trying to remove the a:hover background color of the search element on the main menu with the following css.

    .main_menu ul:first-child > li > a:hover {
    background-color: none !important;
    color: white !important;
    }

    It appears to work when I inspect the element but the code appears not to work when I put it in the quick css section.

    Secondly I need to stylize one element within the secondary menu to create a donate button. Is it possible to have one single menu element extend beyond the perimeters of menu height (i.e menu is height: 15px, button is 30px)

    November 14, 2013 at 3:50 am #188181
    Ismael

    Hi RDCSI!

    You can change the hover color of the search icon using this:

    .header_color .main_menu ul:first-child > li:last-child a:hover {
color: red;
}

    Go to Appearance > Menus then click “Screen Options”. Enable the CSS Classes. Add a css selector on a menu item that you want to change to donate button. Example, add “donate-button” as the css class. Go to Enfold > Styling > Quick CSS then add this code:

    #top .main_menu .menu li.donate-button a {
background: red;
height: 30px !important;
display: block;
line-height: 30px !important;
position: relative;
top: 28px;
}

    Best regards,
    Ismael

    November 14, 2013 at 2:26 pm #188352
    RDCSI

    Hey Ismael,

    I inputted both of the pieces of code along with adding the CSS class to the donate menu item and do not see the change taking place on either. I have also cleared the cache. I noticed with CSS changes I put in the quick style section that they sometimes do not take place and I normally have to add an !important. Any thoughts?

    The site is currently on a MAMP local server so I cannot share a link.

    J

    November 15, 2013 at 5:23 pm #189298
    Yigit

    Hey!

    Please try adding Ismael’s code to Custom.css file inside wp-content\themes\enfold\css folder

    Best regards,
    Yigit

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Removing a:hover color over search icon; Stylizing individual menu elements’ is closed to new replies.