JSFiddle - React, Tailwind, and code Playground

by Chintan Upadhayay

HTML

<div id="dvContent" style="width:400px;height:200px;overflow:auto;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus eu augue id elit dignissim pretium. Nulla ut metus diam. Vivamus mattis sodales massa eu viverra. Fusce elementum dui lacus, nec porttitor velit. Donec vehicula mollis tincidunt. Proin tellus tortor, egestas vel ultrices ullamcorper, accumsan sit amet ligula. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas id purus non justo porttitor pretium. Cras in ipsum dui, ut ru
Aliquam id tempus risus. Donec id odio id dui rutrum dictum. Donec mollis lacus a metus congue porta. Morbi tincidunt elit vel augue venenatis vestibulum. Quisque auctor orci at elit aliquet ullamcorper volutpat nunc feugiat. Phasellus commodo tristique quam, ac mattis odio scelerisque nec. Phasellus nec lobortis odio. Nunc risus mauris, sollicitudin bibendum porta ultricies, vehicula eu odio. Praesent non lorem diam. Nunc sit amet arcu justo, et venenatis magna. Etiam elementum ipsum eu dui interdum aliquet. Duis scelerisque congue venenatis. Quisque fringilla dui sed felis elementum placerat. Donec ultrices sodales eros viverra vulputate.

Donec eu quam nunc, in pharetra libero. Etiam egestas, libero a molestie dapibus, elit neque lobortis nisl, interdum dictum mauris mauris quis enim. Proin porta, nulla et condimentum lobortis, risus lorem ultrices tortor, id cursus nulla libero et lacus. Pellentesque dapibus, erat non vehicula congue, neque est mollis risus, id ornare turpis leo eu eros. Suspendisse commodo elementum odio, in semper est malesuada nec. Praesent et tincidunt mi. Phasellus sodales felis nisl. Pellentesque sit amet arcu justo, auctor adipiscing mauris. Aenean aliquam consequat massa, vitae molestie neque gravida et. Phasellus vehicula euismod porta. Donec eget est enim. Cras mattis commodo sagittis. Vivamus at mauris eu tellus pulvinar pretium a sit amet diam. Pellentesque quis tortor libero. Phasellus eleifend, risus sit amet...

CSS

body
{
    font-family:Arial;
    font-size : 10pt;
    padding : 10pt;
}

div
{
    color: green;
}

span
{
    color : Maroon;
}

JavaScript

$(document).ready(function() {
    var iHeight = $("#dvContent").height();
    var iScrollHeight = $("#dvContent").prop("scrollHeight");

    var msg = 'DIV height is :<b> ' + iHeight + 'px</b> and ScrollHeight is :<b>' + iScrollHeight + 'px</b>';

    $("span").html(msg);

});