Okay, so we were building another site that uses Lightbox in a photo gallery – problem was, the ‘Close’ button didn’t appear to work in Firefox or Safari. The ‘Close’ image was in place, but you couldn’t click on it. After some muddling around, we figured out what the problem was.
On this particular site we had set some styles for floated images that would add margins around them to give some space between the image and other content.
.left { float: left; }
img.left {
margin-right: 15px;
margin-bottom: 10px;
}
For some reason, it appears as if those styles are getting applied to the image in the Lightbox photo gallery, causing it to have a bottom margin that overlaps the ‘Close’ link – and only in Firefox and Safari.
So we just added a new line in our lightbox.css file:
#imageContainer img { margin-bottom: 0; }