Single product page not responsive design on tablet

When viewing single product page on a tablet the design does not ‘manipulates itself​ to best suit the device it is being viewed on’ it just shows the product image full screen on tablet, fine for a mobile phone.
How to get it to ‘display fluidly’ eg. 2 columns on tablet, I managed to change other sections with Elementor to make them repsonsive but can’t see where to make changes for this.
Thanks

Attachments:

You must be logged in to view attached files.

Hello,

WoodMart is based on these breakpoints:

Desktop – min-width: 1025px
Tablet – min-width: 768px and max-width: 1024px
Mobile wide – min-width: 577px and max-width: 767px
Mobile – max-width: 576px

What width do you mean, please?

Best Regard

Thanks for the info, trouble is main image is 700px wide so on a 1024px tablet the image is blown up too much.
Is it not possible to get the description next to the image on tablets so the image isn’t filling the screen.
Can I change the breakpoint somewhere?
thanks

image attached, hoping it would like the attachment on a tablet

Attachments:

You must be logged in to view attached files.

On ipad pro 9.7inch, screen res 1536 x 2048 the single product image fills screen.
Please help thanks

I’ve changed viewpoint tag, doesn’t seem to change anything.

should it be set to scaleable or not ?

thanks

Hello,

The content display depends on the viewport of the device. The viewport of iPad pro 9.7 in vertical orientation 768 x 1024 https://yesviz.com/devices/ipadpro9.7/ So the screen width in this orientation is 768px. This width relates to the mobile view of the theme.

If you need to have two columns on the 768px please let us know, we will provide custom CSS.

Best Regards

Hi, yes please provide custom CSS so it displays correctly on 1536 x 2048 res ipad
as other websites do.

Many thanks

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

@media (min-width: 768px) {
	.product-image-summary-inner > .col-lg-6 {
			-ms-flex: 0 0 50%;
			flex: 0 0 50%;
			max-width: 50%;
	}
}

Best Regards

Excellent, many thanks
looks much better

You are welcome! We are here to help.

Wish you a wonderful day!

[Author]

Posts