JSFiddle - React, Tailwind, and code Playground

HTML

<br />
<table id="pridat_fotky">
                        <tbody><tr>
                            <td class="empty">
                                <button>X</button>
                            </td>
                            <td class="empty"></td>
                            <td class="empty"></td>
                            <td class="empty"></td>
                        </tr>
                        <tr>
                            <td class="empty"></td>
                            <td class="empty"></td>
                            <td class="empty"></td>
                            <td class="empty"></td>
                        </tr>
</tbody></table>

CSS

table#pridat_fotky td {
  width: 100px;
  height: 100px;
  border: 2px solid grey;
  background-repeat: no-repeat;
    /**TO MAKE THE BUTTON APPEAR RELATIVE?**/
  position: relative;
}
/**THE BUTTON**/
table#pridat_fotky td button {
  position: absolute;
  background-color: red;
  font-size: 0px;
  border-style: none;
  border-width: 0px;
  width: 10px;
  height: 10px;
  top: 0px;
  left 50%;
}
table#pridat_fotky {
  margin-left: 20px;
  border-spacing: 10px 2px;
}
table#pridat_fotky td.empty {
  background-image: url("http://u8.8u.cz/starozitnosti/images/no_pic_available.jpg");
  background-color: #AAA;
  background-position: 0 0;
  background-size: 100% 100%;
}  
table#pridat_fotky td.empty.error {
  background-image: url("http://u8.8u.cz/starozitnosti/images/no_pic_error.png");
}  
table#pridat_fotky td.image {
  background-image: url("http://u8.8u.cz/starozitnosti/ok.svg");
  background-size: contain;
  background-position: center center;
}