JSFiddle - React, Tailwind, and code Playground

by vo1daus

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<link rel="stylesheet" href="style.css" type="text/css" media="all">


</head>
<body>


<div id="sheet">
    
    <div id="header"></div>

    <div class="content">
        <div class="vmenu"></div>
        <div class="pagecontent"></div>
    </div>
    
    <div id="footer_cleaner"></div>

</div>
<div id="footer"></div>
</body>
</html>

CSS

html, body {margin:0;padding:0;height:100%;width:100%;}
#page {min-height: 100%;}
#sheet {width: 900px;margin: 0 auto;position: relative;min-height: 100%; background: #faa;}
#header {height:140px;margin:0 auto;width:900px;position: relative;top: 5px;background:#333;}
.content {position: absolute; top: 150px; bottom: 110px; width:900px;margin: 0 auto;background:#555;}
.vmenu {float: left;;width:190px;min-height:100%;margin-bottom:150px;margin-left:10px;}
.pagecontent {float:right;width:680px;min-height:100%;padding:10px;margin-bottom: 150px;}
#footer_cleaner {height: 100px;clear: both;}
#footer {position:relative;height: 100px;margin-top:-100px;margin:0 auto;width:900px;background: #4c4e5a;}