Lightbox image size issue

[Taffy]

We cannot work out why the lightbox pop-up image is smaller than the original on this page (Help Save the Whale Poster on left of page).

Please advise.

http://www.portcentralshopping.com.au/gowings-whale-trust-2/

Attachments:

You must be logged in to view attached files.

[Rui Guerreiro – SUPPORT]

Hi,

I just added this code below in your custom css option.

/* --------------------------------------------
	LIGHTBOX IMAGE FIX
-------------------------------------------- */

.ilightbox-holder div.ilightbox-container {
    width: 100%!important;
    height: 100%!important;
}

It seems to be ok now.

Give it a try.

-Rui

[Taffy]

The CSS fixes the size issue, but the image is off center.

See screen-shot.

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-

.ilightbox-holder.metro-white{
left:30% !important;
}

Thanks
Mohammad

[Taffy]

That is off center too.

I have re-centered it by adding additional CSS

.ilightbox-holder.metro-white{
left: 27% !important;
top: 20% !important;
}

BUT, WE HAVE A PROBLEM.

The entire lightbox pop-up is not responsive.

Can you please have Ed look at this issue, as we need this functionality returned.

It did work perfectly when we bought the theme.

[Mohammad – SUPPORT]

Hi,
My colleague will check you shortly. He is expert in this.
Thanks
Mohammad

[Kyle – SUPPORT]

Hi

Delete previous css and add this:

.postid-16014 .ilightbox-holder.metro-white {
  left: 50%!important;
  margin-left: -298px;
}

– Kyle

[Kyle – SUPPORT]

Sorry, need’s to be inside a media query:

@media only screen and (max-width: 481px) { 
.postid-16014 .ilightbox-holder.metro-white {
  left: 50%!important;
  margin-left: -298px;
}
}

– Kyle

[Taffy]

Sorry, this doesn’t work responsively on smartphone.

The Lightbox code for this entire theme needs to be checked, as it has worked previously.

[Kyle – SUPPORT]

I’m still seeing the old CSS instead of my new CSS: http://d.pr/i/16Bj8/3MiD3Bh4

– Kyle

[Taffy]

Take a look now.

[Kyle – SUPPORT]

You need to remove this:

.ilightbox-holder.metro-white{
left: 27% !important;
top: 20% !important;
}

– Kyle

[Taffy]

Done.

But still no luck on any mobile devices.

Not centered and not responsive.

[Kyle – SUPPORT]

Ahh 2 issues:

1) You’ve ended these rules http://d.pr/i/1fKq3/2uS2PNwF with : instead of ;

2) On my css, change max-width to min-width

– Kyle

[Taffy]

Hi Kyle,

I have made the suggested changes, but no luck.

The lightbox image on this page doesn’t work on any device.

http://www.portcentralshopping.com.au/gowings-whale-trust-2/