JSFiddle - React, Tailwind, and code Playground

by Eric

HTML

<div class="projectContainer">
    <div class="projectContainerHeadline">
         <div class="projectNum">01</div>
         <div class="projectHeadlineText">
             <h2>Test Headline</h2>
             <h3>Test sub-headline</h3>
         </div>
    </div>
</div>

CSS

.projectContainer{width: 100%; float: left;}
.projectContainerHeadline{height: 130px; float: left; width: 100%; background-color: pink;}
.projectNum{font-family: Helvetica,Arial,sans-serif; font-size: 105px; text-align: right; border-top: 11px solid #d9a870; min-width: 100px; float: left;}
.projectHeadlineText{overflow: hidden; }
.projectHeadlineText h2{background-color: blue; margin: 20px 0px 0px 0px;}
.projectHeadlineText h3{background-color: red; margin: 3px 0px 0px 0px;}