Hi,
Love my website but when I view on my mobile device, the photos used as backgrounds in the theme are cropped, did I miss something in the settings? The point of my website is to show people having a conversation and that doesn’t convey on the mobile version. Thank you.
Hey Eileen,
Loss of image data on background images is inevitable due to the difference in screen sizes, you could try to create another section to only show on mobile and upload an image better adapted to that size though. You can give your section unique IDs and then show/hide the correct one with CSS like this:
@media only screen and (min-width: 768px) {
#section-desktop {
display:block !important;
}
#section-phone {
display:none !important;
}
}
@media only screen and (max-width: 767px) {
#section-desktop {
display:none !important;
}
#section-phone {
display:block !important;
}
}
Thanks,
Rikard