How do fix overlapping header text on mobile?

Store Design
1

As you can see, the main header is overlapping with itself. Is there a way I can fix this? Thanks

MrDunkonthem_1-1732577976581.png
MrDunkonthem_1-1732577976581.png493×850 312 KB

2

HI, there

Would you mind sharing your store url?

3

Hi @MrDunkonthem ,

To fix the overlapping header:

add css to the header section

.header-class {
    z-index: 9999;
    position: relative;
    padding: 20px;
    position: sticky;
    top: 0;
}

save and refresh

Got it! If you found my suggestions helpful, please consider liking or marking it as a solution.
Your feedback is appreciated! If you have any more questions or need further assistance, just let me know.

Thanks & Regards
Akshay Bhatt

4

https://1mdzui-uv.myshopify.com/password

maibla

5

No luck.

6

its not working

7

pls try below code

@media only screen and (max-width: 600px) {
 
    .videoBoxInfoTitle {
      font-size: 18px; 
      padding: 10px; 
    }
  }
8

Didn’t work when I pasted in the custom CSS for the header section. Do I need to put it in another section?

9

Click the link, then click in the top right corner “login using password” and enter “maibla” press enter