JSFiddle - React, Tailwind, and code Playground

by Kheema Pandey

HTML

<div class="di_header">
    <div class="di_h_en"><p>I'm left</p></div>
    <div class="di_h_cn"><p>I'm chinese 我是中文</p></div>
</div>

CSS

*{
    margin:0px !important;
}

.di_header{
	display:table;
	width:100%;
}

.di_h_en{
	width:30%;
    height:100px;
	display:table-cell;
	vertical-align:bottom; 
	text-align:left;
    border:solid 1px red;
}

.di_h_cn{
	width:70%;
	display:table-cell;
	vertical-align: bottom;
	text-align:right;
    border:solid 1px red;
    height:100px;
}



.di_h_en p{
	font-size:32px;
    border:dashed 1px black;
}

.di_h_cn p{
	font-size:24px;
    border:dashed 1px black;
    line-height:38px;
}