Display of secondary images on phone

  • Posts: 42
  • Thank you received: 2
3 years 8 months ago #322594

-- url of the page with the problem -- : vixenfire.com.au/index.php/hikashop-menu.../category_pathway-86
-- HikaShop version -- : 4.3.0
-- Joomla version -- : 3.9.19
-- PHP version -- : 7.3
-- Browser(s) name and version -- : FF 77.0.1
-- Error-message(debug-mod must be tuned on) -- : no error

My client asks if secondary images, on phones, can be smaller, thumbnails, rather than large images in a vertical column.
Screenshots will explain better :-)

Currently:



A different website displays like this:



Thanks for your advice.

Paul

Attachments:
Last edit: 3 years 8 months ago by aisweb.

Please Log in or Create an account to join the conversation.

  • Posts: 81477
  • Thank you received: 13060
  • MODERATOR
3 years 8 months ago #322605

Hi,

Well, it's a CSS customization issue.
You've added that CSS in the frontend CSS of HikaShop:
img.hikashop_child_image {
margin: 2px;
height: 125px !important;
}
in order to force the thumbnails to be 125px. But with that size, they are too big to sit on one row on mobile devices.
So you need to reduce that height to 70px for example for mobile devices.
For example, you can add such CSS at the end of the frontend CSS:

@media only screen and (max-width: 650px) {
img.hikashop_child_image {
    margin: 2px;
    height: 70px !important;
}
}

Please Log in or Create an account to join the conversation.

  • Posts: 42
  • Thank you received: 2
3 years 8 months ago #322641

Perfect.
Thank you again Nicolas, great support.

Please Log in or Create an account to join the conversation.

Time to create page: 0.060 seconds
Powered by Kunena Forum