Moving Nav Menu to very top of page ?

.boutique-primary-navigation {
position: relative;
margin-left: .874em;
margin-right: .874em;
padding: 0 1.874em;
display: none;
background-color: blueviolet;

Makes my site look like this now.

https://www.jomcallister.co.uk

• This reply was modified 2 years, 7 months ago by dietredthunder. Reason: Possible update

Hi there,

Were you able to achieve what you wanted? I see that the menu is right in between the logo and the search bar now. (Secondary menu location)

The CSS that you’ve applied has the line display: none; which hides the Primary menu altogether.

I’d suggest removing that CSS code block and unchecking the Primary Menu under Appearance > Menu for the menu that is hidden.

@kaushiksomaiya

Thanks for the reply. Yes I have been playing since my orginal post.

I have put the site back as above on the orginal post.

Trying to get the Main Menu in the dark box put to the very top of the page and reduce the line height a bit. As per the screen grab.

Thought I had it solved yesterday, but it removed my burger menu on the mobile.

Best regards,

DiRT

Hi there,

Thanks for getting back.

Thought I had it solved yesterday, but it removed my burger menu on the mobile.

You can try applying @media rule on your CSS code to make sure it doesn’t apply on the mobile view. You can find more about @media rules here.

I hope this helps. Please don’t hesitate to reach out if you have any further questions.

Cheers!

Hi, I have solved the colour problem. In another thread and marked solved ??

Next
Trying to put the menu at the top of the page.
And hope to reduce the gaps above and below the words in the menu would be nice.

Any thoughts.

Best regards,

DiRT

Hi @dietredthunder

>Trying to put the menu at the top of the page.
And hope to reduce the gaps above and below the words in the menu would be nice.

Some CSS code should definitely help here. Some references to help:

1. https://developer.mozilla.org/en-US/docs/Web/CSS/top
2. https://developer.mozilla.org/en-US/docs/Web/CSS/padding
3. https://developer.mozilla.org/en-US/docs/Web/CSS/margin

Cheers!

Hi @dietredthunder,

Hope the menus now appear as expected! We haven’t heard back from you for a while, so I’m going to mark this post as resolved.

If you need any further help here, please let us know. Or, if you need additional help with the Storefront theme, please start a new thread and we’ll be able to help you out there.

Thank you!