-
Posts
-
Hi what custom css can I enter to remove background image in color section in mobile / responsive devices? Please let me know custom css and ID tag I can enter into Section ID so I can specify this to specific sections not all sections.
Thanks much,
Chris
Hi Chris,
I’ve also been looking into this. The background images in color sections still don’t display correctly in IOS (iPad and iPhone). You can add a css rule to hide the color section when the screen is below a certain pixel size.
In the layout builder give the color section an ID in the appropriate field. For example hp_bgr_1.
Now in your custom css add this (works on iPad 1 and 2 and only in portrait mode):
@media only screen and (max-width: 768px) {
Add your Mobile Styles here
#hp_bgr_1 {
display: none;
}
}Sorry, that actually removed the entire section. Is there a way to only remove the background image but show content in section?
Hi Yigit, this is for a clients site that isn’t published yet. I can put up on a sample site if that helps? Let me know.
Thanks,
Chris
Hi Chris,
Yes actually that’d be great if you could so we can see what exactly it will look like.
Regards,
Yigit
Thanks Yigit if you can PM me your IP I’ll get you access past the construction page or email me at chris [at] chrisomlor.com
Thanks,
Chris
Thanks Yigit, this code worked. I posted it here for others that may have similar request. You’ll need to place hp_bgr_1 as color section ID.
Thanks again,
Chris
@media only screen and (max-width: 989px) { div#hp_bgr_1 { background-image: none!important; } }
- The topic ‘Remove section background image in mobile / responsive layout’ is closed to new replies.