JSFiddle - React, Tailwind, and code Playground

by J7R1X

HTML

<div id="div1">
  <div id="div2">
  </div>
</div>

CSS

#div1 {
  background-color: black;
  height: 200px;
  width: 200px;
  position: relative;
}

#div2 {
  background-color: white;
  height: 50px;
  width: 50px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

JavaScript

const div1 = document.getElementById('div1')
const div2 = document.getElementById('div2')

div1.onclick = () => {
	console.log("Div 1")
}

div2.onclick = () => {
	console.log("Div 2")
}