JSFiddle - React, Tailwind, and code Playground
by Chris Ball
HTML
<div class="parent">
<p class="title">This is just a simple test</p>
<div class="small">
<span>1st April</span>
<span>— 4th September</span>
</div>
</div>
SCSS
.parent {
border: 1px solid red;
font-family: sans-serif;
line-height: 1.2;
vertical-align: top;
}
.title {
background: yellow;
display: inline;
font-size: 3.5rem;
font-weight: bold;
margin: 0;
padding-right: 1rem;
position: relative;
}
.title > span {
display: inline-block;
}
.small {
/* background: orange; */
display: inline-block;
padding-top: 0.95rem;
}
.small > span {
display: block;
}