JSFiddle - React, Tailwind, and code Playground

by Santosh Thakur

HTML

<h1>Box Model padding + Width + border</h1>
<div id="box"><p>Sir, Answer show inside console
<br>
Sir, if I am wrong please let me know
</p></div>

CSS

#box{
  width: 500px;
  padding:0 20px;
  border: 1px solid red;
  height:300px;
}

JavaScript

var ow = document.getElementById('box').offsetWidth;
var cw = document.getElementById('box').clientWidth;
console.log('OffsetWidth' + " - "+ ow);
console.log('ClientWidth' + " - "+ ow);