• Hello,
    I’m using few Anchors on one page and I added some of the links to my header main menu (Few link from the same page in my main menu).
    I set font color to black and the active menu color to red but when I pick one of the links from the header menu, All links are turning into red.
    How do make only the one user picks turn into red?
    Thanks for your time.
    Ronen

Viewing 3 replies - 1 through 3 (of 3 total)
  • Can you share your CSS here so we can see what you’ve done?

    Thread Starter ronenin

    (@ronenin)

    Thanks for your reply.
    I’m using Elemntor but here is the CSS from the template (OceanWP).

    /* Custom hover color to the trainers social icons */
    .elementor-widget.custom-social .elementor-social-icon:hover { opacity: 1; background-color: #0eb290; border-color: #0eb290; color: #fff; }

    /* Margin bottom to the subscribe title */
    .elementor-widget.subscribe-tilte { margin: 0 0 10px; }

    /* Placeholders color*/
    #searchform-dropdown input::-webkit-input-placeholder,
    body .sidr-class-mobile-searchform input::-webkit-input-placeholder { color: #81e4cf; }
    #searchform-dropdown input::-moz-placeholder,
    body .sidr-class-mobile-searchform input::-moz-placeholder { color: #81e4cf; }
    #searchform-dropdown input:-ms-input-placeholder,
    body .sidr-class-mobile-searchform input:-ms-input-placeholder { color: #81e4cf; }

    /* Scroll up button */
    #scroll-top { right: 0; bottom: 0; border-radius: 0; }
    #scroll-top, #scroll-top:hover { background-color: transparent; }

    /* Footer */
    #footer-widgets .footer-box { text-align: center; }
    #footer-widgets .social-widget .style-light li a, #footer-widgets .social-widget .style-dark li a,
    #footer-widgets .social-widget .style-colored li a { background-color: #263036; color: #708e9f; border-color: #263036; width: 40px; height: 40px; line-height: 40px; }
    #footer-widgets .social-widget .style-light li a:hover, #footer-widgets .social-widget .style-dark li a:hover,
    #footer-widgets .social-widget .style-colored li a:hover { background-color: #0eb290; color: #fff !important; border-color: #0eb290 !important; }

    /* Responsive */
    @media (max-width: 767px) {
    /* Center the buttons in the hero */
    .elementor-element.hero-btn { text-align: center !important; }
    /* Center elements on mobile */
    .elementor-element.center-mobile, .elementor-element.center-mobile .elementor-icon-box-wrapper { text-align: center !important; }
    /* Margin top “Working” title on the contact page */
    .elementor-element.margin-mobile .elementor-heading-title { margin-top: 30px; }
    /* Social icons on the contact page */
    .elementor-social-icons-wrapper { text-align: left; }
    .elementor-element.contact-social .elementor-social-icon { width: 44px; height: 44px; line-height: 44px; }
    .elementor-element.contact-social .elementor-social-icon:nth-child(4) { margin-right: 5px !important; }
    }
    @media (max-width: 480px) {
    /* Title size in the hero */
    .elementor-element.hero-title .elementor-heading-title { font-size: 30px; }
    }
    /*Post preview size*/
    h3.theme-heading.related-posts-title{
    font-size:24px;
    }
    h3.related-post-title{
    font-size:16px;
    }

    There doesn’t look like there’s anything in that CSS that controls menus (but I could be wrong).

    Your best bet woudl be to ask in the supprot forum for that theme – https://wordpress.org/support/theme/oceanwp/

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Links to Anchors in main menu get the same color when one is choosen’ is closed to new replies.