bamab Posted November 19, 2022 Posted November 19, 2022 I have this code, but what I want to achieve is spacing/offset of each image, like I have it on my desktop version. Can I controll it here by some new value/command at this code? Thank u for any help in advance 🙏 /* Masonry one item on mobile */ @media screen and (max-width:767px) { .gallery-masonry-wrapper.gallery-masonry-list--ready { height: auto !important; } figure.gallery-masonry-item { position: relative !important; width: 100% !important; display: block !important; transform: unset !important; } .gallery-masonry-item-wrapper { height: auto !important; } .gallery-masonry .gallery-masonry-item[data-loaded] img { width: 100% !important; } .gallery-masonry { padding-left: 0 !important; padding-right: 0 !important; } }
Beyondspace Posted November 20, 2022 Posted November 20, 2022 18 hours ago, bamab said: I have this code, but what I want to achieve is spacing/offset of each image, like I have it on my desktop version. Can I controll it here by some new value/command at this code? Thank u for any help in advance 🙏 /* Masonry one item on mobile */ @media screen and (max-width:767px) { .gallery-masonry-wrapper.gallery-masonry-list--ready { height: auto !important; } figure.gallery-masonry-item { position: relative !important; width: 100% !important; display: block !important; transform: unset !important; } .gallery-masonry-item-wrapper { height: auto !important; } .gallery-masonry .gallery-masonry-item[data-loaded] img { width: 100% !important; } .gallery-masonry { padding-left: 0 !important; padding-right: 0 !important; } } Can you share your site with the protected password so I can take a look? BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Pinch/Zoom images, videos - PDFs Lightbox - ...) </> 🗓️ Delivery Date Picker (Date picker form field) Gallery block 7.1 workaround </> 🤖 Ask me anything
tuanphan Posted November 23, 2022 Posted November 23, 2022 On 11/21/2022 at 5:04 AM, bamab said: sure 👍🏻😊 its www.progressm.cz Add some attributes to this code figure.gallery-masonry-item { position: relative !important; width: 100% !important; display: block !important; transform: unset !important; } It will be figure.gallery-masonry-item { position: relative !important; width: 100% !important; display: block !important; transform: unset !important; margin-bottom: 50px; margin-left: 20px; margin-right: 20px; width: calc(~"100% - 40px") !important; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment