Docs

[Itwebdevelopment]

Hi, when I click on the images here:

https://gyazo.com/d39b020e7d51da42d13c30c9f87b97d8

On mobile it puts the bottom of the light box at the bottom of the screen.

Like this:

https://gyazo.com/371e6aa506fc8263803884e15ce7c432

I want to center the lightbox to the screen.

Here is the URL:

https://www.dzdrones.com/product/carbon-fiber-dz-drone-with-goggles-and-remote/

Can you help?

[Christian]

Hey there,

Please add the code below in your Appearance > Customize > Custom > Global CSS

.woocommerce .pp_woocommerce .ppt {
    display: none !important;
}

Thanks.

[Itwebdevelopment]

Hi I did this but its still loading the lightbox at the bottom and won’t center it until I scroll up or down. Is there anyway to fix this?

[Rupok]

Hi there,

I have checked and it seems opening on top of the page on my end.
You can add this under Custom > CSS in the Customizer.

.pp_pic_holder.pp_woocommerce {
	top: 20px !important;
}

Let us know if that helps.

[Itwebdevelopment]

Worked! Thanks! But can we make it so this top: 20px only happens on mobile devices? Is that possible?

Thanks!

[Prasant Rai]

Hello There,

Yes, that possible. Please use following CSS:

@media only screen and (max-width: 500px) {
    .pp_pic_holder.pp_woocommerce {
	top: 20px !important;
}
}

Thanks.

[Author]

Posts