Center Navigation, Footer Link Highlights

This topic has 11 replies, 4 voices, and was last updated 7 years, 11 months ago ago by Rose Tyler

  • Avatar: npucci
    npucci
    Participant
    January 6, 2017 at 00:24

    Hello,

    1. It does not look like my Top Navigation text is centered on my website. I’d like to have the Main Nav menu centered between my logo on the left, and my icons on the right (please refer to website in private content).

    2. When on an active page of a link in the footer, it highlights a different background color. I do not want this. How can I disable this? However, it would be good to make the text change a different color – how can i do that?

    Please, contact administrator
    for this information.
    10 Answers
    Avatar: 8theme
    8theme
    Support staff
    January 6, 2017 at 10:19

    Hello,

    Could you please provide a login and password to your website so we can see it?

    Regards

    Avatar: npucci
    npucci
    Participant
    January 7, 2017 at 02:14

    Sorry – see Private content.

    I have also noticed on mobile devices, the website has a slight horizontal scrolling (there should be none). Website moves side to side a little bit.

    Please, contact administrator
    for this information.
    Avatar: Eva
    Eva Kemp
    Support staff
    January 9, 2017 at 09:54

    Hello,

    Please also provide WP Dashboard credentials.

    Thank you.
    Regards,
    Eva Kemp.

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    January 9, 2017 at 09:56

    Hello,

    Try to add this code in Global Custom CSS section:

    .footer-top .widget_nav_menu li.current-menu-item a {
        background: transparent;
        color: black !important;
    }
    .navbar-collapse.collapse {
        display: flex !important;
        justify-content: center;
        margin-top: 15px;
    }

    and this for mobile:

    .navbar-right .navbar-right {
        left: 14px;
    }

    Regards,
    Rose Tyler.

    Avatar: npucci
    npucci
    Participant
    January 11, 2017 at 03:12

    While this code does move the navigation over on desktop (although I still wouldn’t say it is centered)

    .navbar-collapse.collapse {
        display: flex !important;
        justify-content: center;
        margin-top: 15px;
    }

    It really screws up the website / navigation on mobile devices.

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    January 11, 2017 at 08:39

    Hello,

    Oh, I see. Try this code:

    ul#menu-main-1 {
        display: inline-block;
    }
    .menu-main-container {
        text-align: center;
        margin-left: -75px;
    }

    Regards,
    Rose Tyler.

    Avatar: npucci
    npucci
    Participant
    January 12, 2017 at 02:37

    That code worked the best for the desktop menu centering… however, then it get rid of the menu in the mobile side pull-out navigation

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    January 12, 2017 at 08:02

    Hello,

    Please, put the previous code in “Custom CSS for desktop” section.

    Regards,
    Rose Tyler.

    Avatar: npucci
    npucci
    Participant
    January 13, 2017 at 02:21

    OK, but now the sticky header when you scroll down is off-centered AND it takes on a different font style and color…

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    January 13, 2017 at 08:13

    Hello,

    Try to use this code:

    .fixed-header-area ul#menu-main-1 {
        margin-left: 15%;
    }
    
    .fixed-header-area .menu > li > a {
        color: #4e3524;
        font-family: Cabin;
        font-style: normal;
        letter-spacing: 0.1em;
    }

    Regards,
    Rose Tyler.

  • Viewing 11 results - 1 through 11 (of 11 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.