JSFiddle - React, Tailwind, and code Playground

HTML

<div class="Flexible-container">
    <table style="width:100%">
        <tr>
            <td>
                <div class="image">
                    <div class="trick">
<a href="https://sharepoint.bowlesrice.com/pgrps/lit/els/Pages/default.aspx">
<img src="https://sharepoint.bowlesrice.com/pgrps/lit/PublishingImages/Pages/default/ELS.png" /></a>

                    </div>
                </div>
            </td>
        </tr>
        <tr>
            <td>
                <div class="image">
                    <div class="trick">
<a href="https://sharepoint.bowlesrice.com/pgrps/lit/env/Pages/default.aspx">
<img src="https://sharepoint.bowlesrice.com/pgrps/lit/PublishingImages/Pages/default/ENV%20and%20REg.png" /></a> 
                    </div>
                </div>
        </tr>
        <tr>
            <td>
                <div class="image">
                    <div class="trick">
<a href="https://sharepoint.bowlesrice.com/pgrps/lit/litblue/Pages/default.aspx">
<img src="https://sharepoint.bowlesrice.com/pgrps/lit/PublishingImages/Pages/default/Lit%20Blue.png" /></a>

                    </div>
                </div>
            </td>
        </tr>
        <tr>
            <td>
                <div class="image">
                    <div class="trick">
<a href="https://sharepoint.bowlesrice.com/pgrps/lit/litgreen/Pages/default.aspx">
<img src="https://sharepoint.bowlesrice.com/pgrps/lit/PublishingImages/Pages/default/Lit%20Green.png" /></a>

                    </div>
                </div>
            </td>
        </tr>
        <tr>
            <td>
                <div class="image">
                    <div class="trick">
<a href="https://sharepoint.bowlesrice.com/pgrps/lit/litred/Pages/default.aspx">
<img src="https://sharepoint.bowlesrice.com/pgrps/lit/PublishingImages/Pages/default/Lit%20Red.png" /></a>

                    </div>
                </div>
            </td>
        </tr>
    </table>
</div>
<style>
    .Flexible-container {
       ...

CSS

/* For square screens or taller */

@media screen and (max-aspect-ratio:1/1) {

    .Flexible-container {

        position: relative;

        padding-top: 0px;

        padding-bottom: 50px;

        height: 100%;

        overflow: hidden;

    }

    .image {

        font-size: 0;

        text-align: left;

        width:90%;

        /* Container's dimensions */

        height: 75px;

    }

    img {

        display: inline-block;

        vertical-align: middle;

        max-height: 100%;

        max-width: 100%;

    }

    .trick {

        display: inline-block;

        vertical-align: middle;

        height: 150px;

    }

}