JSFiddle - React, Tailwind, and code Playground

by Fredy Sudhir

HTML

<div id="matriz">
    <div id="top">Top content</div>
    <div id="left">Lorem ipsum </div>
    <div id="right">Lorem ipsum </div>
</div>

CSS

#matriz {
    width:70%;
    margin:0 auto;
    background-color:#ccc;
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
    overflow:hidden;
    font-size:0;
}

#top{
    width:100%;
    background-color:blue;
    font-size:16px;
}

#left {
    background-color:yellow;
    max-width:50%;
    display: inline-block;
    font-size:16px;
}

#right {
    max-width:50%;
    background-color:green;
    display: inline-block;
    font-size:16px;
}