Big margin to the right of the page (Solved)

Store Feedback

Topic summary

A user encountered a large right margin issue on their store page.

ThePrimeWeb provided a CSS fix to add to the theme.liquid file:

  • Insert custom CSS below the <head> tag targeting .header with overflow-x: clip !important

This resolved the margin but created secondary issues:

  • Two footer menus were overflowing/splitting across columns
  • Language selector became unclickable

Attempted fixes using max-width and display: grid properties either restored the margin or cut off the header on the right side.

Resolution: ThePrimeWeb suggested the user contact their paid theme’s official support, noting that previous modifications may have broken theme functionality. The original poster thanked them for the assistance and agreed to reach out to theme support.

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

I have this page im working on and the margin to the right of the page there is this big margin after the page ends

Miguel3403_0-1708944656545.png
Miguel3403_0-1708944656545.png808×873 302 KB

2

Hey @Miguel3403 ,

Go to your theme’s “Edit Code” Option, then in the search bar type “theme.liquid”
Below the tag “” tag paste the following. Screenshot attached for reference.

@media only screen and (min-width: 960px) {
    header.header {
        overflow-x: clip !important;
    }    
}

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1708950093411.jpeg
ThePrimeWeb_0-1708950093411.jpeg1253×933 87.9 KB

3

thanks and these last two menus overflowing how can i fix that?

Miguel3403_0-1708950948021.png
Miguel3403_0-1708950948021.png2128×1138 311 KB

4

I don’t know why it’s split into the next column after 3 items. Normally when you do this to the last menu, this will happen anyway.

Only way to fix it is to make it all appear on one column

Instructions are the same.
5

Also given that this is a paid, theme you should reach out to the theme support.

6

This line of code seems to be causing me to be unable to select the last language without it i can select the last language but the margin comesback

header.header {
overflow-x: clip !important;
}

7

You try replacing it with this

div#portuguese-wines-menu-8 ul, div#gourmet-menu-7 ul {
    display: grid !important;
    max-width: max-content !important;
}
8

With the first line you can select the language but the the margin comesback with the second line the margin goes away but the header gets cut in the right side

9

I don’t know man, you can request your theme’s support since you have paid for the theme. You’ve definitely done something before to break the theme, I can’t find it out.

10

Thanks will try support thanks for the help anyways you really helped me out today