JSFiddle - React, Tailwind, and code Playground

by Fondzee

HTML

<div class="container">
  <div class="row">
    <div class="panel-body">
      <div class="table-responsive">
        <table class="table table-bordered table-hover table-striped" style="overflow-x:auto;">
          <thead>
            <tr>
              <th>obrázek</th>
              <th>jméno</th>
              <th>věk</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td rowspan="4" width="0px"><img src="https://dummyimage.com/200x200/000/fff" class="img-responzive"></td>
              <td>Jano</td>
              <td>23</td>
            </tr>
            <tr>
              <td>Jano</td>
              <td>23</td>
            </tr>
            <tr>
              <td>Jano</td>
              <td>23</td>
            </tr>
            <tr>
              <td>Jano</td>
              <td>23</td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>

CSS

@import url('https://getbootstrap.com/dist/css/bootstrap.css');
td img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

td {
  padding: 50px;
}