CieloLodge

Ignore what I just wrote - I see they typo (2 #collection) - so now it looks like this and it is working. Thank you so much!!! This is such a huge help!! /* Press page mobile */ @media screen and (max-width:767px) { body#collection-5fcfccc45dba994a4884cba4 .Parallax-item:first-child img { width: 100% !important; height: auto !important; left: 0 !important; } } /* Gallery */ @media screen and (max-width:767px) { body#collection-5ce2e3bea7bed400017e55d3 .Parallax-item:first-child img { width: 100% !important; height: auto !important; left: 0 !important; } }

Hi tuanphan - Thank you so much - that worked! Now I am wondering how to do that for all of my pages. Would the code look like what is below? Or do I have to add some kind of <start > <stop> tag between the code sections? I tried to do it for my Gallery page and the image is still getting cut off on mobile. Thank you so much for your help!! /* Press page mobile */ @media screen and (max-width:767px) { body#collection-5fcfccc45dba994a4884cba4 .Parallax-item:first-child img { width: 100% !important; height: auto !important; left: 0 !important; } } /* Gallery */ @media screen and (max-width:767px) { body#collection-#collection-5ce2e3bea7bed400017e55d3 .Parallax-item:first-child img { width: 100% !important; height: auto !important; left: 0 !important; } }

Site URL: http://www.cielolodge.com Hi there - My banner images are not displaying properly on mobile. Only the top part of the image is displayed - not the whole image. On the laptop/desktop the images are fine. I am using the Maple template in the Brine family. Examples are attached. Is there a way to dynamically resize images for mobile? If yes, what is the code and where exactly would I put it? Thank you so much for your help!!