JSFiddle - React, Tailwind, and code Playground

Difference overlay test.

by Travis Almand

HTML

<div id="container">
  <button>button</button>
  <div id="image"></div>
</div>

<img id="captured" />

CSS

body,
html {
  height: 100%;
  margin: 0;
  padding: 0;
}
body {
  align-items: center;
  display: flex;
  justify-content: center;
}
#container {
  align-items: center;
  border: 1px solid black;
  display: flex;
  height: 200px;
  justify-content: center;
  position: relative;
  width: 200px;
}

button {
  background-color: gainsboro;
  border: 3px solid green;
  border-radius: 7px;
  color: gray;
  font-weight: bold;
  padding: 10px 20px;
}

#image {
display: none;
  background-image:...