JSFiddle - React, Tailwind, and code Playground

by CMCDragonkai

HTML

<div class="section_container">
    <section>
        <div class="attention_image_container">
        </div>
        <div class="attention_container">
            <p>Code for Australia seeks to leverage the power of web technologies, open data, data visualisation and open source governance to address civic issues, community problems and develop digital infrastructure.</p>
        </div>
    </section>
</div>

<div class="section_container">
    <section>
        <div class="attention_container">
            <p>We believe digital technologies can improve civic transparency, efficiency, participation and education.</p>
        </div>
        <div class="attention_image_container">
        </div>
    </section>
</div>

CSS

.section_container{
    margin: 20px auto;
}

.section_container section{
    background: #000;
    padding: 10px;
}

.section_container section div{
    display: table-cell;
    vertical-align: middle;
}

.section_container section .attention_container{
    width: 70%;
    background: #097;
}

.section_container section .attention_image_container{
    width: 30%;
    background: #ccc;
    height: 200px;
}