Hello - i’ve created a new page template and added 2 image bar elements to it. I am struggling to get the images within them to fit properly - they are banners, and they won’t fit right on desktop and are not responsive on mobile or ipad. I have attempted to fix this but cannot get them working pro…

@JKP84 , @media only screen and (max-width: 768px){ .image-bar__item.image-bar__item--3a0d4e5f-3944-47a0-b78e-d45e8dc50af8.box.ratio-container.lazyloaded { background-size: 100%; } .image-bar__item.image-bar__item--56bc8672-216c-40cf-a2e8-68ff1acf730f.box.ratio-container.lazyloaded { backgr…

@oscprofessional Thanks for your suggestion - it hasn’t really worked, on mobile view it now has a huge area of white space above and below. and the top banner is still partly cut off in height on desktop view?

@JKP84 , @media only screen and (max-width: 768px){ .image-bar__item.image-bar__item--3a0d4e5f-3944-47a0-b78e-d45e8dc50af8.box.ratio-container.lazyloaded { background-size: 100%; } .image-bar__item.image-bar__item--56bc8672-216c-40cf-a2e8-68ff1acf730f.box.ratio-container.lazyloaded { background-siz…

@oscprofessional i’m afraid it is still cutting off part of the height on desktop and not working correctly on mobile. I’d like the banners to be above one and another, there is too much space.

Mobile responsive image bar on alternate page template

Store Design

oscprofessional June 7, 2022, 6:06am 6

@JKP84 ,

Check the video attached

Topic		Replies	Views
How to fix a too small image banner on mobile? Store Design landing-page	14	92	February 7, 2024
different image for mobile and Desktop Store Design design , css	6	57	December 5, 2024
Problem with the image sizes on desktop and mobile Store Design	14	101	April 4, 2022
Mobile Banner and Pictures cropped for mobile Store Design	12	140	August 10, 2021
Image not fitting properly in image banner Store Design	7	196	August 21, 2023

Mobile responsive image bar on alternate page template

Related topics