Simplified % % Divs
by Jason Rose
HTML
<div class="page-container">
<div class="left-col"><div class="right-col-inner">d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>vv</div></div>
<div class="right-col"><div class="left-col-inner">d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br>d<br></div></div>
<div class="clear"></div>
</div>
CSS
html, body {
width: 100%;
height: 100%;
margin: 0;
}
.page-container {
width: 100%;
height: 100%;
background: yellow;
}
.left-col {
width: 15%;
height: 100%;
float: left;
background: red;
position: fixed;
}
.left-col-inner{
margin:20px;
}
.right-col {
left: 15%;
width: 85%;
float: left;
background: green;
position: relative;
}
.right-col-inner{
margin:20px;
}
.clear {
clear: both;
}