MaxGalleria 1.3.1: Fix for Caption Issues

Shortly after we released MaxGalleria 1.3, a customer reported a couple issues with one of their galleries, namely that the captions were displaying as dark text on the dark background (text should be white by default) and that a couple images that had longer captions were breaking the grid layout for the thumbnails.

We investigated and have fixed both issues, details below.

Caption Styles Moved Off Container Class

The issue with the caption showing dark text on the dark background was discovered when using the Image Showcase template with captions enabled on the large showcase image. The mistake was that the color and text-shadow styles for the caption were defined on the caption container class instead of the caption class itself. This required moving those two styles to the caption class in all skin stylesheets for all image and video templates.

Display Style Changed for Thumbnail <LI> Elements

Also on this customer’s Image Showcase gallery, she enabled the option to show thumbnail captions *below* the thumbnail images, and when she did, a couple of the captions were longer than the others, thus causing gaps in the grid layout. Definitely not expected behavior.

This was caused by the thumbnail <LI> styles to use “float: left” and “display: block”, like this:

.mg-image-showcase .mg-thumbs ul li {
    float: left !important;
    display: block !important;
    position: relative !important;
}

We realized right away that we should have used a “vertical-align: top” and “display: inline-block” instead. So now the CSS is this:

.mg-image-showcase .mg-thumbs ul li {
    vertical-align: top !important;
    display: inline-block !important;
    position: relative !important;
}

The above code shows the changes for the Image Showcase template, but the change was made in all image and video templates.

This was the more “serious” issue of the two, so it’s nice to have this issue resolved.