So basically i’ve got banner grid added to my website. On desktop version it looks fine but on mobile, the image MENS and WOMENS are too big. I would love to decrease the height of the images just on mobile version, is that possible? See screenshot of what i mean, i want this big image to be smaller. Website link : stockunion.co.uk
Hey @rory123 ,
The problem is very simple, Just go to your theme editor and change the CSS styling of the images in the media frames. This will solve your problem.
If it is difficult we can always help you out.
@SivaGautham Well i know i need to change css but not sure what code to use thats why im here.
@media (max-width: 767px)
.split-image img, .unero-banners-grid ul li img, .unero-banners-metro ul li img {
height: auto;
width: 100%;
}
In the height instead of auto you can use the pixels of your desired size and to not affect the first image you can remove “.split-image img” for that CSS rule or you can write a new CSS rule for that in the same “@media”
Thank you! Would i add this code in theme.css? or different asset/snippet?
You need to edit that code according to your requirements, I have just helped you in finding the CSS code that you should change, but changing it can be done by seeing your theme file and your store.
Thank you.
Still need help