JSFiddle - React, Tailwind, and code Playground

by Alexandru Gatea

HTML

<table style="background: #fff; width: 500px;  border-collapse: collapse; border-radius: 10px; overflow: hidden;">
  <thead>

    <tr>

      <th align="center"  width="300px" colspan="3">
      		<img src="https://images4.alphacoders.com/936/936378.jpg" 
					style="width: 100%"
					alt="">
				
      </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td align="center" width="100px;"  ></td>
      <td align="center"  width="300px"  style="border: 1px solid #000">b</td>
      <td align="center"  width="100px"  ></td>
    </tr>
    <tr>
      <td align="center" width="100px;"  ></td>
      <td align="center"  width="300px" style="border: 1px solid #000">b</td>
      <td align="center"  width="100px" ></td>
    </tr>
		
		    <tr>
      <td align="center" width="100px;"></td>
      <td align="center"  width="300px" height="50"></td>
      <td align="center"  width="100px"></td>
    </tr>
  </tbody>
</table>

CSS

* {margin: 0; box-sizing: border-box;}

body {
	background: #ccc;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100vh;
}