JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<div class="colmask threecol">
<div class="colmid">
<div class="colleft">
<div class="col1">
<!-- Column 1 start -->
c1
<!-- Column 1 end -->
</div>
<div class="col2">
<!-- Column 2 start -->
c2
<!-- Column 2 end -->
</div>
<div class="col3">
<!-- Column 3 start -->
<div id="ads">
c
</a>
</div>
</div>
</div>
</div>
</div>
<div id="footer">
footer
</div>
</body>
CSS
body {
margin:0;
padding:0;
border:0;
width:100%;
background:#fff;
min-width:600px;
font-size:90%;
}
@font-face {
font-family: 'pokemon';
src: url('pokemon.eot?') format('eot'),
url('pokemon.woff') format('woff'),
url('pokemon.ttf') format('truetype'),
url('pokemon.svg') format('svg');
font-weight:normal
font-style: normal;
}
.poketype {
font-family: pokemon;
font-size: 9px;
}
.gigadrain {
font-family: pokemon;
font-size: 18pt;
color: #000;
}
.header {
height:36pt;
width:100%;
font-family: pokemon;
font-size:16pt;
text-align:center;
line-height:36pt;
}
.h1 {
font-family: pokemon;
font-size: 24pt;
background-color: #FFC;
}
.blog {
border-width: 27px;
-moz-border-image: url(divborder.png) 27 stretch;
-webkit-border-image: url(divborder.png) 27 stretch;
-o-border-image: url(divborder.png) 27 stretch;
font-family: pokemon;
font-size: 9px;
padding: 0px;
margin-top: 0px;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 10px;
border-color: rgba(128,128,128,0.3);
}
.blogtext {
font-family: pokemon;
font-size: 9px;
background-color:#FFF;
}
.button {
line-height: 35px;
display: block;
height: 35px;
width: 100%;
background: #00B25C;
text-decoration: none;
color: #000;
}
.button:hover {
background-color: #61D89F;
}
img {
margin:10px 0 5px;
}
#ads img {
display:block;
padding-top:10px;
}
/* 'widths' sub menu */
#layoutdims {
clear:both;
background:#eee;
border-top:4px solid #000;
margin:0;
padding:6px 15px !important;
text-align:right;
}
/* column container */
.colmask {
position:relative;
clear:both;
float:left;
width:100%; /* width of whole page */
overflow:hidden; /* This chops off any overhanging divs */
}
/* common column settings */
.colright,
.colmid,
.colleft {
float:left;
width:100%; /* width of page */
position:relative;
}
.col1,
.col2,
.col3 {
float:left;
position:relative;
padding:0 0 1em 0;
overflow:hidden;
}
/* 3 Column...