JSFiddle - React, Tailwind, and code Playground

HTML

<div class="para1">Male moved second given cattle every light own You're void.</div>

<div class="para2">Good days replenish give from give cattle beast one after.</div>

CSS

body {
    position: relative;
}
.para1 {
    display: inline-block;
    width: 200px;
    left: 0px;
    top: 10px;
    position: absolute;
}
.para2 {
    display: inline-block;
    width: 200px;
    left: 210px;
    top: 10px;
    position: absolute;
}

JavaScript

window.addEventListener('mouseup', function () {
    var sel = window.getSelection(),
        rect = sel.getRangeAt(0).getBoundingClientRect();

    console.log('=======================');
    console.log(rect.top);
    console.log(rect.left);
    console.log(rect.width);
    console.log(rect.height);

}, false);