Need help fixing a code.

Shopify Discussion

Topic summary

A user added CSS code to remove scrollbars and plus signs from their website header, but the plus signs still appear on mobile devices. Additionally, text under images gets cut off on mobile.

Issue identified: The original code appears corrupted or reversed in the post, making it difficult to verify the exact implementation.

Proposed solutions:

  • Use display:none targeting the correct CSS selectors
  • Apply .section-header .header .side-nav-section .nav ul a.plus::after{ display:none!important} for both desktop and mobile
  • Wrap the code in a media query @media screen and (max-width: 600px) to target mobile devices specifically

Current status: The discussion remains open with troubleshooting in progress. The user provided website credentials for further assistance.

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

I put this code into my website to get rid of scroll bar and plus signs in header. But the plus signs are still showing on mobile. I also noticed that the text under images on mobile get cut off.

Any ideas? Thank you in advance!

.section-header .header .left .menu ul li a.plus::after {
content: none;
}
.section-header .header .left .menu ul li ul.second {
overflow: auto;
}

AntonBjarki_0-1732722794454.png
AntonBjarki_0-1732722794454.png400×189 26 KB

AntonBjarki_1-1732722801053.png
AntonBjarki_1-1732722801053.png400×190 14.2 KB

2

you can try also display:none and make sure you wrote correct css selectors

3

The code worked on pc but it dousn’t work for mobile.

website: antonbjarkiolsen.com
pass: passwordpassword

4

If you want to remove from both (mobile & desktop)

.section-header .header .side-nav-section .nav ul a.plus::after{ display:none!important}

If you want to remove only mobile

@media screen and (max-width: 600px) {

.section-header .header .side-nav-section .nav ul a.plus::after{ display:none!important}
}

1 Like