Menu options highlight and are underlined

Store Design
,

Topic summary

A store owner is experiencing unwanted highlighting and underlining effects on menu items during navigation and hover states.

Initial Problem:

  • Top and bottom menu options show highlighting, color changes, and underlining when users navigate or hover over them
  • User wants to disable these visual effects entirely

Partial Solutions Achieved:

  • Removed underlining from top menu by deleting text-decoration: underline from base.css
  • Applied custom CSS code (added above </body> tag in theme.liquid) to address some styling issues

Remaining Issues:

  • Submenu items under “Shop” still display underlining
  • Menu text appears gray instead of white like headers
  • All menu options still change color on hover (example: “beauty” section)

Additional Requests:

  • Center the top menu (similar to footer menu alignment)
  • Mobile view adjustments: position logo far left, place menu option between search and login

The discussion remains ongoing with iterative CSS solutions being tested but not fully resolving all visual styling problems.

Summarized with AI on November 13. AI used: claude-sonnet-4-5-20250929.
1

In the top and bottom menu of my store, the menu options are highlighted and are underlined when navigating.

How can i turn this off?

I do not want the menu options highlighted / change color and underlined when navigating.

Nielsdijkshoorn_0-1704575310041.png
Nielsdijkshoorn_0-1704575310041.png274Ă—376 3.27 KB

Nielsdijkshoorn_1-1704575329644.png

2

Hey @Nielsdijkshoorn

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

Best Regards,
Moeed

3

https://434d7f.myshopify.com/

rtaymi

4

i managed to get the top menu clear of underlining bij removing ; underline as text-decoration in the base.css.

But the sub menu under shop still has the problem, same as the menu on the footer

and i also want the top menu centered

Nielsdijkshoorn_1-1704577925496.png
Nielsdijkshoorn_1-1704577925496.png1846Ă—177 24.9 KB

5

Hey @Nielsdijkshoorn

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1704578360718.png
Moeed_0-1704578360718.png1589Ă—562 27.8 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

6

ik worked but the color is still gray and not white like the headers

Nielsdijkshoorn_1-1704578325477.png
Nielsdijkshoorn_1-1704578325477.png209Ă—125 2.05 KB

and in this submenu underlining is still on

Nielsdijkshoorn_0-1704578301179.png
Nielsdijkshoorn_0-1704578301179.png208Ă—281 4.15 KB

7

Hey @Nielsdijkshoorn

I’ve updated the code, add this updated code and it should be good to go then!

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

1 Like
8

thanks but the submenu is still underlining , see picture below. And while hovering al menu options change color, see beauty

Nielsdijkshoorn_0-1704581196643.png
Nielsdijkshoorn_0-1704581196643.png273Ă—330 7.77 KB

Do you also perhaps know how i can change this, see picture below. in mobile view. i would like to have the logo far left, and the menu option between search and login

Nielsdijkshoorn_1-1704581234157.png