1. Dismiss Notice

Menu CSS not able to change submenu characteristics

Discussion in 'Compass WordPress Theme' started by chrisw, Oct 6, 2017.

  1. chrisw

    chrisw New Member

    Joined:
    Sep 29, 2017
    Messages:
    9
    Likes Received:
    1
    I got what I want working on the default page.

    upload_2017-10-6_16-33-52.png
    Menu items are underlined in purple on hover. Sub items are dashed and on hover solid under line.



    When I go to another page under the default page the menu is not consistent.

    upload_2017-10-6_16-36-30.png
    This is what I see when I use the menu on a sub page. The dashed underline is correct and solid on hover is there but it has a background applied. I cannot find that color in the CSS to replace it.

    CSS I am using for that menu item

    #menu .ddsmoothmenu li li a.selected, #menu .ddsmoothmenu li li a:hover {
    color: #005E84;
    background-color: #FFFFFF;
    border-bottom:1px solid #835174;

    ????
    Any ideas????
     
    chrisw, Oct 6, 2017
    #1
  2. akbar92

    akbar92 Support Staff Staff Member

    Joined:
    Jun 3, 2017
    Messages:
    2,318
    Likes Received:
    49
    Hello,

    Will you please share your website URL here so that we can give you an exact CSS code.

    Looking forward to hearing from you.

    Regards,
    Akbar
    InkThemes.com
     
    akbar92, Oct 7, 2017
    #2
  3. chrisw

    chrisw New Member

    Joined:
    Sep 29, 2017
    Messages:
    9
    Likes Received:
    1
    The site is not available to the internet. It is an intranet site. What else can I share?
     
    chrisw, Oct 18, 2017
    #3
  4. akbar92

    akbar92 Support Staff Staff Member

    Joined:
    Jun 3, 2017
    Messages:
    2,318
    Likes Received:
    49
    Hi,

    I have tried the above CSS code and it is working fine at our end.

    Try to put the CSS code in the Additional CSS section instead of Custom CSS, go to (Dashboard->Appearence->Customizer->Additional CSS)

    Code:
    #menu .ddsmoothmenu li li a.selected, #menu .ddsmoothmenu li li a:hover {
color: #005E84;
background-color: #FFFFFF;
border-bottom:1px solid #835174;
}
    Hope this helps...!

    If the problem still persists, do let me know.

    Looking forward to hearing from you.
     
    akbar92, Oct 23, 2017
    #4
  5. chrisw

    chrisw New Member

    Joined:
    Sep 29, 2017
    Messages:
    9
    Likes Received:
    1
    The code makes sense but I am still not seeing the desired results. The menu is not taking the
    background-color: #FFFFFF; . It is taking the BG color from the "Theme Stylesheet" -> InkThemes -> Styling Options. When change that color the menu reflects that theme and not the CSS.
    The example below is set to black theme stylesheet with custom CSS in Additional CSS

    upload_2017-10-26_13-18-31.png
     
    chrisw, Oct 26, 2017
    #5
    smith likes this.
  6. akbar92

    akbar92 Support Staff Staff Member

    Joined:
    Jun 3, 2017
    Messages:
    2,318
    Likes Received:
    49
    Hi,

    Try this CSS code:

    Code:
    #menu .ddsmoothmenu li li a.selected, #menu .ddsmoothmenu li li a:hover {
color: #005E84 !important;
background-color: #FFFFFF !important;
border-bottom:1px solid #835174 !important;
}
    Hope this helps...!

    Regards,
    Akbar
    InkThemes.com
     
    akbar92, Oct 27, 2017
    #6
  7. chrisw

    chrisw New Member

    Joined:
    Sep 29, 2017
    Messages:
    9
    Likes Received:
    1
    That's it! It worked! Thanks!!!!
     
    chrisw, Oct 27, 2017
    #7
  8. akbar92

    akbar92 Support Staff Staff Member

    Joined:
    Jun 3, 2017
    Messages:
    2,318
    Likes Received:
    49
    akbar92, Oct 28, 2017
    #8
  9. chrisw

    chrisw New Member

    Joined:
    Sep 29, 2017
    Messages:
    9
    Likes Received:
    1
    .
     
    chrisw, Nov 6, 2017
    #9

Share This Page