JSFiddle - React, Tailwind, and code Playground

by neal_fletcher

HTML

<div class="single-insight-content-wrap">
    <div class="single-insight-content">
        <div class="single-insight-article-wrap">
            <div id="single-article-left-col" class="single-article-column">
                <div class="single-insight-titles-wrap">
                    <div class="titles-header">Header</div>
                    <div class="titles-title">Title</div>
                </div>
                <div class="single-article-text-section">
                    <p>Text goes here, here and here. here too.</p>
                </div>
            </div>
        </div>
    </div>
</div>

CSS

html {
    font-size: 62.5%;
}
body {
    font-size: 14px;
    font-size: 1.4rem;
}
/* =14px */
 .single-insight-content-wrap {
    position: relative;
    width: 1110px;
    height: auto;
    margin: 0 auto;
    margin-top: 50px;
}
.single-insight-content {
    position: relative;
    width: 100%;
    height: auto;
    margin-top: 30px;
}
.single-insight-article-wrap {
    position: relative;
    width: 100%;
    height: auto;
    margin-top: 20px;
}
.single-article-column {
    display: inline-block;
    vertical-align: text-top;
}
#single-article-left-col {
    width: 525px;
    margin-right: 160px;
}
.single-insight-titles-wrap {
    position: relative;
    width: 350px;
    height: auto;
    margin-bottom: 20px;
}
.single-insight-titles-wrap .titles-header {
    position: relative;
    width: 180px;
    height: auto;
    margin-top: 5px;
    padding-top: 4px;
    border-top: 1px solid #58585a;
    font-family:'Times';
    font-weight: normal;
    font-style: normal;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 17px;
    line-height: 1.7rem;
    text-align: left;
    color: #58585a;
}
.single-insight-titles-wrap .titles-title {
    position: relative;
    width: 100%;
    height: auto;
    margin-top: 5px;
    font-family:'Times';
    font-weight: normal;
    font-style: normal;
    font-size: 40px;
    font-size: 4.0rem;
    line-height: 40px;
    line-height: 4.0rem;
    text-align: left;
    color: #000000;
}
.single-article-text-section {
    position: relative;
    width: 100%;
    height: auto;
    margin-bottom: 80px;
    font-family:'Times';
    font-weight: normal;
    font-style: normal;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 17px;
    line-height: 1.7rem;
    text-align: left;
    color: #58585a;
}
.single-article-text-section p {
    margin-bottom: 1em;
}