JSFiddle - React, Tailwind, and code Playground

by Alex

HTML

<div class="wrap clearfix">
    <div class="container">
        <div class="cont">
            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Neque architecto nemo maxime numquam quia in veniam nisi sequi repellat doloremque id provident nulla iste eaque voluptatibus sint fuga corrupti ipsam?
        </div>
    </div>
    <div class="sidebar">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate reprehenderit adipisci similique saepe voluptates quam molestiae magni dolor ipsam illo nisi eligendi reiciendis commodi. Voluptate necessitatibus facere iure blanditiis quae!
    </div>
</div>

CSS

html {
    font-family: sans-serif;
}
.wrap {
    min-width: 1000px;
    max-width: 1400px;
    margin: auto;
}
.container {
    width: 100%;
    float: left;
}
.cont {
    padding: 0 310px 0 0;
}
.sidebar {
    background: #f80;
    width: 300px;
    float: left;
    margin-left: -300px;
    *margin-right: -4px;
}

/* !!!!!!! */
/* clearfix это в самое дно css файла!!! */
.clearfix {
    /*-height: 1%;*/ /*IE6*/
	*zoom: 1; /*IE6-7*/
	display: table;
}
.clearfix:after {
	content: '1 1';  /*Op15+*/
    /*content: '1 1 1 1 1 1 1 1 1 1 1';*/ /*Op12+*/
	font: .1px/0 a;
	display: block;
	word-spacing: 99in;
    overflow: hidden; /*IE8-*/
}
/* clearfix */