JSFiddle - React, Tailwind, and code Playground

HTML

<span></span><span></span>

CSS

span {
    position: absolute;
    top: 1em;
    left: 1em;
    border: 10px solid transparent;
    border-right: 10px solid blue;
}

span+span {
    position: relative;
    left: 2em;
}

JavaScript

// Why does position:absolute change the span into a 0-height
// element, as long as it's empty? If we turn the first element
// into <span>.</span>, the span magically has normal height again.