Header Blowing Out in Mobile View

[BukShop]

 

Hello,

I manage thebukshop.com store. Recently the header section widened so there is a horizontal scroll. I am using a second image for the mobile view. 

Please see attached screenshot and thanks in advance for your help.

Best,

Mike

[suyash1]

@BukShop please add this css to the very end of your base.css file and check,
Shopify Admin -> Online Store ->Theme -> Edit code -> base.css

@media screen and (max-width:749px)
{.section-header .header{min-width: 100%;}}

[BukShop]

That worked, thank you!

[DaisyVo]

Hi @BukShop 

You can try to follow this step
Step 1: Go to Edit code
Step 2: Find file base.css and add this code at the end of the file

@media screen and (max-width: 750px) {
header.header.header--top-left.header--mobile-center.page-width.header--has-menu.header--has-social.header--has-localizations {
    min-width: 100% !important;
}
}

Result 

Best,

DaisyVo

[BiDeal-Discount]

Hi @BukShop 

I see the issue on your site, you can follow this way to fix it.
let try to add Custom CSS to your Theme Settings:

@media screen and (max-width: 989px) {
  .header-wrapper .header {
    min-width: unset;
  }
}

The result will be: