JSFiddle - React, Tailwind, and code Playground

HTML

<div id="box">
    <h1>Box with an Unknown Width</h1>
    <div id="child"></div>
</div>

CSS

body {
    background: #cda;
}

#box {
    background: #fff;
    display: table;
    height: 90px;
    margin: 0 auto;
    padding: 6px;
    position: relative;
}

#child {
    background: #a6a;
    bottom: 16px;
    height: 20px;
    left: 16px;
    margin-left: auto;
    margin-right: auto;
    position: auto;
    width: 20px;
}