JSFiddle - React, Tailwind, and code Playground

by sachips

HTML

<div id="wrapper">
    <div id="main">
        <div id="content">中央コンテンツ</div>
    </div>
    <div id="left">左サイド</div>
    <div id="right">右サイド</div>
</div>

CSS

#wrapper {
    height: 500px;
    min-width: 600px;
}
#main {
    height: 500px;
    width: 100%;
    float: left;
}
#content {
    background-color: #FF6600;
    margin-right: 200px;
    margin-left: 150px;
    height: 500px;
}
#left {
    background-color: #0099FF;
    float: left;
    margin-left: -100%;
    width: 150px;
    height: 500px;
}
#right {
    background-color: #00CC33;
    float: left;
    margin-left: -200px;
    width: 200px;
    height: 500px;
}