JSFiddle - React, Tailwind, and code Playground

by qhoc

HTML

<div id="header">My Headegfd gdfgdgdr</div>
<div id="results"></div>

CSS

#results {
    margin-top: 50px;
    font-family: "Courier New";
    font-size: 13px;
}

#header {
    background: yellow;
}

JavaScript

function measureWidth(selector) {
    var item = $(selector).eq(0);
    var pos = item.css("position");   // save original value
    item.css("position", "absolute");
    var width = item.width();
    item.css("position", pos);
    return(width);
}

$("#results").append("Normal Width: " + $("#header").width() + "<br>");
$("#results").append("Content Width: " + measureWidth("#header") + "<br>");