We set up the Global Nav, the header and main nav are not being responsive. Is it possible for you to set up another choice like this in your theme that is compatible with Responsive layout? We’ve tried to make adjustments but is it hard to work with your theme set up. Any advise?
Also, we like to add another logo right of the main logo in the header as well.
Hi jengraph!
Thank you for visiting the support forum!
The header layout that you’re trying to achieve is a bit complicated and is really not responsive friendly. You might want to consider removing the header background on mobile devices specially on iPhone. The text at the bottom will be stretched beyond recognition when viewing on small screens. Please try to add this on Quick CSS or custom.css to resize the background image on smaller screens:
@media (min-width: 640px) and (max-width: 980px) {
body .header_color .header_bg {
height: 116px;
margin-top: 140px !important;
background-size: 100% 100% !important;
}
}
@media (max-width: 639px) {
body .header_color .header_bg {
height: 80px;
margin-top: 128px !important;
background-size: 100% 100% !important;
}
}
If you want to remove the header background on smaller screens, please use this:
@media (max-width: 768px) {
.header_color .header_bg, .header_color {
background: #ffffff;
background-color: #ffffff;
}
}
Cheers!
Ismael