Need to standardize CTGY page image space

[lesliekirk]

In the Levels ReadyTheme there is an excellent javascript that standardizes the divs in each row. I need to find a way "add space" around images that are smaller than the tallest image in the row. For example, a row has three thumbnails 73px, 137px and 87px high. I need to add "space" around the two small images so that the &mvt:sub_category:name and &mvt:category:name; all align nicely in a row.

Here is the sub-category code:

<mvt:assign name="l.settings:subcat_count" value="miva_array_elements(l.settings:subcats)" />
<mvt:if expr="l.settings:subcats GT 0">
    <div class="row bg-white main-content-row sub-category-layout">
        <mvt:foreach iterator="sub_category" array="subcats">
            <mvt:if expr="l.settings:sub_category:image">
            <div class="column half medium-one-third sub-category uppercase">
                    <a href="&mvt:sub_category:link;" title="&mvt:sub_category:name;" class="bold">
                        <img src="&mvt:sub_category:image;" alt="&mvt:sub_category:name;" title="&mvt:sub_category:name;" />
                        &mvt:sub_category:name;</a>
<span style="font-size:0.8rem;">&mvt:category:name;</span>

                </div>
            <mvt:else>
            <div class="column half medium-one-third sub-category uppercase">
                    <a href="&mvt:sub_category:link;" title="&mvt:sub_category:name;" class="bold">&mvt:sub_category:name;</a>
                </div>
            </mvt:if>
        </mvt:foreach>
    </div>
    <!-- end sub-category listings -->
</mvt:if>

I could move the image into it's own div and then add a second a tag moving the &mvt:sub_category:name; outside the original a tag. But then when you mouse over the image the hover effect won't happen for the &mvt:sub_category:name;.

Here's the site that I'm trying to tweak http://www.filingstore.com/file-labels.html

[Matt Zimmermann]

You could try moving all the elements within the A tag and try using transform-y: 50% to move it to be more centered or you could try converting the layout to use flexbox where you could justify the content to the center.

[Bruce - PhosphorMedia]

Or use an image resizer program that buffers smaller images centered inside a specified picture size...

[lesliekirk]

Or use an image resizer program that buffers smaller images centered inside a specified picture size...

Such as? Recommendations are welcome.