Header not responsive on mobile

Highlighted
New Member
7 0 0

Hi, the header on my store is not responsive on mobile... well actually it is... but when viewing it in portrait, I pinch the screen on the video demo page to see the full width of the videos below the header appears smaller and I thought it would expand... maybe I need to change the width of the videos(?).

 

reload tools.com

0 Likes
Highlighted

Hello @Mandos,

Please add below css

@media only screen and (min-width: 768px) {
  .nav-container.visible-lg.visible-md.hd2 {
    display: block!important;
}
}
@media only screen and (max-width: 767px) {
  .ma-nav-mobile-container.hd2 {
    display: block;
}
}
Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
New Member
7 0 0

Thank you. Sorry where can I add the code... it's been a while since I worked on this site last.

0 Likes
Highlighted

@Mandos,

1. Go to Online Store->Theme->Edit code
2. Asset->custom.css->paste below code at bottom of file

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
New Member
7 0 0

within custom.css.liquid?

0 Likes
Highlighted

@Mandos,

yes..

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
New Member
7 0 0

Ok that is where I copied it to... reloaded the page and pinched it to make the page smaller but the header still stayed at the smaller size...?

0 Likes
Highlighted
New Member
7 0 0
I think the videos are overriding the sizing somehow(?). I set up a new page and tried the pinch thing and the header resized as wanted.
0 Likes