JSFiddle - React, Tailwind, and code Playground

by funato

HTML

<div class="container">
<div class="column01">
<p>あああああああああああああああああああああ</p>
</div>
<div class="column02">
<p>おおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおお</p>
</div>
<div class="column03">
<p>いいいいいいいいいいいいいいいいいいいいいい</p>
</div>

CSS

.container{
    border:dotted 2px blue;
    display:-webkit-box;
    display:-moz-box;
	display:box;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    
}
.column01{
    width:100px;
		background-color:orange;
	}
.column02{
    background-color:greenyellow;
    -webkit-flex: 1 0 200px;
    -moz-flex: 1 0 200px;
    flex: 1 0 200px; 
    -moz-box-flex:1;
    min-width:200px;
	}

.column03{
    width:100px;
		background-color:pink;
	}