[HansH]

Hello Skandha,

On the website Laura.hagmeijer.nl there is a shopping page.

You can see there four categories and specials on base of the featured content.

On the iPad all is going well. The woocommerce shopping page images and the featured content images have the same measures.

When you look at the page on the iPhone (iPhone 8), then the measurements of the shopping page icons (woocommerce images categories) are much bigger than the featured content images.

Is it possible to get the woocommerce shopping page images as small as the featured content images below?

Kind regards

Hans Hagmeijer

[Skandha]

@hansh: Hello Hans,

Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

.columns-4 ul.products li.product {
width: 50%;
}

Let me know if this works out!
Kind Regards,
Skandha

[HansH]

Hello Skandha,

 

This didn’t work. Now on the iPhone it is perfect, but on the laptop, the images are twice the measure.

It was my meaning that the measure on the laptop stays the same (it was perfect) and on mobile the measure decreased.

You can see what I mean on Laura.hagmeijer.nl. Now the website is under construction, I can give you my credentials per mail if you want it.

Kind regards

Hans Hagmeijer

 

[Skandha]

@hansh: Hello Hans,

Please replace the code above with the following.

@media screen and (max-width: 1024px) {
.columns-4 ul.products li.product {
width: 50%;
}
}

Let me know if this works out!
Kind Regards,
Skandha

[HansH]

Hello Skandha,

It works fine on laptop, iPad, iPhone screen. Thank you and sorry for maybe not being clear in the forst mail.

 

Kind regards

 

Hans Hagmeijer

[Skandha]

@hansh: Hello Hans,

Glad it worked out. Have a good day! 🙂

Kind Regards,
Skandha

[Author]

Posts