- This topic has 4 replies, 2 voices, and was last updated 8 years, 2 months ago by .
Viewing 5 posts - 1 through 5 (of 5 total)
Viewing 5 posts - 1 through 5 (of 5 total)
- You must be logged in to reply to this topic.
Home › Forums › Free Themes › Photo Perfect › Header images on mobile devices
Tagged: responsive
Hi,
The Header Image on Laptop and Pad occupy the whole area starting from the top of the screen. Logo, Site Title and Dropdown Menus display on top of the Header Image.
While on mobile devices, for example an iPhone 6, there is a grey bar on top of the Header Image. Logo, Site Title and Dropdown Menus show on top of that grey bar instead of the Header Image.
Is it possible to change this behavior? I prefer a consistent display of the Header Image across multiple platforms and devices.
My website is: http://www.magicbricktech.com
Thank you for your support.
Best 🙂
Paste the following Custom CSS code in Appearance -> Customize -> Theme Options -> Advance Options -> Custom CSS
@media only screen and (max-width: 767px) {
.site-header {
background-color : none;
position: fixed;
}
}
Hope this will resolve your concern in mobile devices.
Thanks
Hi,
Thanks for your response.
The code doesn’t work. But if I add one more line, it will work. Is it ok to add the line ‘width: 0’?
@media only screen and (max-width: 767px) {
.site-header {
background-color : none;
position: fixed;
width: 0;
}
}
Best
Hi,
Sorry, my mistake. If ‘width: 0;’ is added, then Logo will go away on mobile devices.
Best
Add the z-index value something higher. It should work now.
Final code
@media only screen and (max-width: 767px) {
.site-header {
background-color : transparent;
position: fixed;
z-index: 99999;
}
}
Hope this helps!
Cookie | Duration | Description |
---|---|---|
cookielawinfo-checkbox-analytics | 11 months | This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Analytics". |
cookielawinfo-checkbox-functional | 11 months | The cookie is set by GDPR cookie consent to record the user consent for the cookies in the category "Functional". |
cookielawinfo-checkbox-necessary | 11 months | This cookie is set by GDPR Cookie Consent plugin. The cookies is used to store the user consent for the cookies in the category "Necessary". |
cookielawinfo-checkbox-others | 11 months | This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Other. |
cookielawinfo-checkbox-performance | 11 months | This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Performance". |
viewed_cookie_policy | 11 months | The cookie is set by the GDPR Cookie Consent plugin and is used to store whether or not user has consented to the use of cookies. It does not store any personal data. |