JSFiddle - React, Tailwind, and code Playground

HTML

<div id="parent">
    <div id="inner"></div>
    <span></span>
    <div id="other"></div>
</div>

<p id="info"></p>

CSS

div {
    width: auto;
    border: 1px solid black;
    display: -webkit-flex;
    display: flex;
}
#parent{
    padding: 10px;
}

#inner {
    width: 50px;
    height: 50px;
    margin: auto;
}

#other {
    width: 20px;
    height: 50px;
    margin-right: 10px;  
}

JavaScript

var innerStyle = window.getComputedStyle(document.getElementById('inner')),
    paragraph = document.getElementById('info');


var inner = document.getElementById("inner");
var other = document.getElementById("other");

paragraph.innerHTML = innerStyle.getPropertyValue('margin-top') + ' '
                        + getMargin(inner).right + ' '
                        + innerStyle.getPropertyValue('margin-bottom') + ' '
                        + getMargin(inner).left;


function getMargin(elem) {
    var parent = elem.parentNode,
        prev = elem, 
        next = elem, 
        leftEdge, 
        rightEdge;
    
    var pos = elem.getBoundingClientRect();
    var parentPos = parent.getBoundingClientRect();
    var parentComputed = window.getComputedStyle(parent);
    while((prev = prev.previousSibling) && !prev.getBoundingClientRect){}
    while((next = next.nextSibling) && !next.getBoundingClientRect){}
    if(prev)
        leftEdge = prev.getBoundingClientRect().right; //+ getMargin(prev).right
    else {
         leftEdge = parentPos.left + parseInt(parentComputed.getPropertyValue("padding-left")) + parseInt(parentComputed.getPropertyValue("border-left-width"))
    }
    if(next)
        rightEdge = next.getBoundingClientRect().left; //- getMargin(next).left;
    else {
         rightEdge = parentPos.right - parseInt(parentComputed.getPropertyValue("padding-right")) - parseInt(parentComputed.getPropertyValue("border-right-width"))
        
    }

    return { 
        left: pos.left - leftEdge, 
        right: rightEdge - pos.right 
    } 
}

console.warn(getMargin(inner));
console.warn(getMargin(other));