JSFiddle - React, Tailwind, and code Playground

by deepak sisodiya

HTML

<div id="div1" style="height:100px;width:300px;padding:10px;margin:3px;border:1px solid blue;background-color:lightblue;"></div>
<br>
<button>Display dimensions of div</button>
<p>innerWidth() - returns the width of an element (includes padding).</p>
<p>innerHeight() - returns the height of an element (includes padding).</p>

JavaScript

// jquery innerWidth() and innerHeight()

$("button").click(function () {
    var txt = "";
    txt += "Width of div: " + $("#div1").width() + "</br>";
    txt += "Height of div: " + $("#div1").height() + "</br>";
    txt += "Inner width of div: " + $("#div1").innerWidth() + "</br>";
    txt += "Inner height of div: " + $("#div1").innerHeight();
    $("#div1").html(txt);
});