JSFiddle - React, Tailwind, and code Playground

by Neo Aptt

HTML

<div class="row">
    <div class="col-7">
        <canvas></canvas>
    </div>
    <div class='col-3'>
        <div class="controls">
             <h2>Controls</h2>

            <button class="btn" onclick="initBuffers(1)">Man</button>
            <br/>
            <br/>Use the mouse to rotate the view.</div>
    </div>
</div>

CSS

canvas {
    border: black solid 1px;
    width=800 px;
    height=450 px;
    text-align=center;
    margin:auto;
}
.col-7 {
    min-width:70%;
    background-color:blue;
    display:inline-block;
}
.col-3 {
    background-color:yellow;
    display:inline-block;
    min-width:30%;
}
.col-7, .col-3 {
    margin:0px;
    padding:0px;
    float:left;
    height:100%;
}
.row{
    background-color:red;
    height:auto;
    width:100%;
    display:flex;
}