JSFiddle - React, Tailwind, and code Playground

HTML

<table class="imgtable" style="border: 1px solid black;">
    <tbody>
        <tr>
          <td class="imgs" style="border: 1px solid black;">
              <img alt="2b - 69" src="../Images/2b_-_69.jpg" width="100%" />
            </td>
        </tr>
        <tr>
          <td class="caption">A 1795 photograph of some stalwarts under the famous banyan tree “…all sentiment…” and a mute witness to the growth of cricket in Calcutta.</td>
        </tr
    </table>
</table>

CSS

table.imgtable {
    width: 100% !important;
    
    margin-left: "auto" !important;
    margin-right: "auto" !important;
    text-align: "center" !important;
}

table.imgtable td.caption {
    padding-top: 7px !important;
    padding-bottom: 7px !important;
    padding-left: 1opx !important;
    padding-right: 10px !important;
    border-right: 3px solid #262626 !important;
    border-top: 1px solid #262626 !important;
    border-bottom: 3px solid #262626 !important;
    border-left: 1px solid #262626 !important;
    font-family: "EB Garamond 08" !important;
    text-align: center !important;
    font-size: 80% !important;
    background-color: white !important;
    border-radius: 3px !important;
    width:"auto" !important;  
}

table.imgtable td.imgs {
    padding-top: 7px !important;
    padding-bottom: 0 !important;
    width:100%;
}

img {
    width: "auto" !important;
}