Main Menu Display

  • Author
  • #95069

    Hi Avid team,

    I’ve recently just purchased a WordPress premium account and the Avid Theme.

    I have customised the layout to exactly how I would like it, but there’s one tiny problem that remains. The colours that I have selected for the display, clash with my custom background image – but only in the Navigation Menu. This means that the Navigation Menu at the top is difficult to see, and isn’t pronounced.

    As I was using the Customizer, I noticed that the layout changes when you switch between different views for – Computer, Tablet & Mobile displays. On the Tablet & Mobile layout displays, the Navigation Menu changes to a solid background, which works perfectly for my classing background issue.

    So to bring this full circle, I’ll ask my question. Is there a way, using custom CSS, to have the same Navigation Menu solid bar that is displayed for Tablets & Mobile, for the Computer display as well. Currently they are slightly different layouts, but like I say, this would completely fix the clashing background issue.

    I can only hope that this makes sense, so please feel free to ask me any questions that you may have!

    Kind regards

    The blog I need help with is: (visible only to logged in users)


    Hi Chris,

    The site looks great!

    How about like this?

    nav {
        background-color: #321956;
    Original poster

    Hello again!

    Thank you very much, I’m very happy with the site. Avid is such a great theme!

    I’ve tried what you’ve suggested, I like it.

    If at all possible, I feel it may work slightly better if it is extended all the way to the very top of the page; so exactly the same as what you’ve suggested but just another block of purple that goes behind the entire logo section, to match the footer. And then I’ll add a smaller logo. Does that make sense?

    Kind regards


    Hey Chris,

    That one is trickier because of the way the padding is applied and the way the code is set up.

    You can change nav to header but I don’t think it looks as nice.

    You might try changing the background class that I gave you in the last thread to .container — and applying the dark purple to your page background color.

    Original poster


    Thanks for trying, I think I’ll just keep the purple nav bar.

    Really appreciate your speedy responses and all your help with this!

    Kind regards


    Sure thing Chris.

    Good luck with the new site!

  • The topic ‘Main Menu Display’ is closed to new replies.