JSFiddle - React, Tailwind, and code Playground

by Shah Danial

HTML

<div id = "outer-container">
   <div id = "content-area">
   <div class="para">
   Display Conents 
   </div>
   <br/><br/><br/><br/>
   </div>
</div>

CSS

body, html {
    height: 100%;
}

#outer-container {
  background: gray;
  height: 100%;
  border: 1px solid #ddd;
 }
 
 #content-area{
  /* height: 50%; */
   background: #000;
   color:#fff;
 }

JavaScript

document.getElementById('outer-container').onclick = function(e) {
    if(e.target == this) {
        console.log('outside');       
    } else {
        console.log('inside');
    }
}