JSFiddle - React, Tailwind, and code Playground

by Ken Watanabe

HTML

<h1><span>text is centered</span></h1>
<h1><span>but the width is 100%.</span></h1>
<br/>
<br/>
<h1><span>How can I make it so that the width</span></h1>
<h1><span>is only the widht of the text?</span></h1>

CSS

html, body {
    width:100%;
    height:100%;
    font-size:100%;
    font-family:helvetica;
    font-weight:normal;
    font-style:normal;
}
span {
    margin: 0 auto;
    display: table;
    font-size: 5vh;
    line-height: 1;
    white-space: nowrap;
    background:red;
}