JSFiddle - React, Tailwind, and code Playground

by iBertel

HTML

<div class="wrapper">
    <div class="table-wrap">
        <div class="item">test1</div>
        <div class="bottom-item">test2</div>
    </div>
</div>

CSS

html, body {
     width:100%;
    height:100%;    
}
* {
    margin:0;
    padding:0;
}
.wrapper {
    width:100%;
    height:100%;
    background-color:#F60;
}
.table-wrap {
    width:100%;
    height:200px;
    display:table;    
}
.item {
    display:table-cell;
    vertical-align:bottom;
    background-color:#F34;
}
.bottom-item {
    display:table-cell;
    vertical-align:bottom;
    background-color:#fff;
    height:20px;
}