Question

So I need lightbox 2 to have a maximum image width to resize images that are too large.

To do this I have adjusted the lightbox.css file to the following

#lightbox img {
  max-height:700px;
  max-width:700px;
}

This works in resizing the image itself, however the white Lightbox overlay remains the full size of the original image file so the image just kind of gets lost in the middle of the Lightbox. Any ideas? I appreciate your help 🙂

Answer 1

Set this:

.lb-outerContainer {
    max-width: 720px; 
    max-height: 720px;
}
.lb-dataContainer {
    max-width: 220px; /* For the text below image */
}