JSFiddle - React, Tailwind, and code Playground

by fliptheweb

HTML

<div id="block"></div>
<input type="text" id="input" />
<div id="result">

</div>

CSS

html {
  min-height: 100%;
}

body {
  height: 100vh;
  padding: 0;
  margin: 0;
}

#block {
  position: fixed;
  width: 1px;
  height: 100vh;
}

Babel + JSX

var input = document.getElementById('input')
var checkTheHeight = () => {
	var element = document.getElementById('result')
  element.innerHTML = element.innerHTML + ";\n " + document.body.clientHeight
}

window.addEventListener('resize', checkTheHeight)

input.addEventListener('focus', checkTheHeight)
input.addEventListener('keypress', checkTheHeight)

checkTheHeight()