JSFiddle - React, Tailwind, and code Playground
HTML
<body style="width:1000px;height:1000px;">
<div id="d" style="display:inline-block;">
<svg id="s" xmlns="http://www.w3.org/2000/svg" version="1.1" width="200px" height="200px">
<rect width="200px" height="200px" style="fill:rgb(0,0,255);"/>
</svg>
</div>
</body>
CSS
*
{
margin: 0;
padding: 0;
}
JavaScript
var div = document.getElementById('d');
var rect = div.getBoundingClientRect();
alert(rect.width);
alert(rect.height);
var svg = document.getElementById('s');
var rect = svg.getBBox();
alert(rect.width);
alert(rect.height);