JSFiddle - React, Tailwind, and code Playground

by TrueBlueAussie

HTML

<div id="valid" style="top: 123.45px"></div>
<div is="invalid" style="top: wrong"></div>
<table>
    <tr>
        <td></td>
        <td>Int</td>
        <td>Float</td>
    </tr>
    <tr>
        <td>Valid</td>
        <td id="validint"></td>
        <td id="validfloat"></td>
    </tr>
    <tr>
        <td>Invalid</td>
        <td id="invalidint"></td>
        <td id="invalidfloat"></td>
    </tr>
</table>

JavaScript

jQuery.fn.cssInt = function (prop) {
    return parseInt(this.css(prop), 10) || 0;
};


jQuery.fn.cssFloat = function (prop) {
    return parseFloat(this.css(prop)) || 0;
};


$('#validint').text($('#valid').cssInt('top'));
$('#validfloat').text($('#valid').cssFloat('top'));

$('#invalidint').text($('#invalid').cssInt('top'));
    $('#invalidfloat').text($('#invalid').cssFloat('top'));