JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapped2">
    <div class="wrapped1">
        <div class="post">Q: WHAT'S GOING ON???
            <br/>A: I HAVE NO IDEA!!!</div>
        <div class="bully">55.55</div>
    </div>
</div>

CSS

html, body {
    background-color: #fff;
    color: #98012E;
    font-family: arial;
    font-size: 18;
}
h1 {
    font-size: 48;
    text-align: center;
}
h2 {
    font-size: 36;
}
.wrapped2{
    float:left;
    width:100%;
    background:green;
    position:relative;
    right:40%;
    overflow:hidden;
    position:relative;
}
.wrapped1 {
    float:left;
    width:100%;
    background:red;
    position:relative;
    right:30%;
}
.post {
    height:auto;
    float: left;
    overflow:hidden;
    background:red;
    position:relative;
    left:70%;
}
.bully {
    position:relative;
    left:70%;
}