jakerocheleau

.lft-column {
	width: 70%;
	
	background: indianred;
	}

.rt-column {
	width: 250px;
	overflow: hidden;/* This does the magic */
	float: right;

jakerocheleau

/**
 * Inner-element Hover
 */
body { padding: 0px 20px; }

.container { position: relative; }
.mini { position: absolute; top: 10px; left: 15px; 
display: none;
padding: 4px 5px; 
background: rgba(255,255,255,0.8); 

jakerocheleau

/**
 * Inner-element Hover
 */
body { padding: 0px 20px; }

.container { position: relative; }
.mini { position: absolute; top: 10px; left: 15px; 
display: none;
padding: 4px 5px; 
background: rgba(255,255,255,0.8); 

jakerocheleau

/**
 * html-css column layouts
 */
html { background: #f06; background: linear-gradient(45deg, #f06, yellow);
min-height: 100%; }
div { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.container { display: block; position: relative; max-width: 1000px; min-width: 550px; margin: 0 auto; }

#left { width: 220px; background:#c9c; position: absolute; left: 0; top: 0; height: 100%; }

jakerocheleau

/**
 * html-css column layouts
 */
html { background: #f06; background: linear-gradient(45deg, #f06, yellow);
min-height: 100%; }
div { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

#wrapper { max-width: 1000px; min-width:750px; margin: 0 auto; }
.container { height: 100%; float: left; background: #fff; }

jakerocheleau

/**
 * columns test
 */
body {
background: #f06;
background: linear-gradient(45deg, #f06, yellow);
min-height: 100%; }
div { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#wrapper { max-width: 1000px; margin: 0 auto; }
#container3 { float:left; width:100%; background:green; overflow:hidden; position:relative; }

jakerocheleau

/**
 * columns-test-2
 */

html { background: #f06;
background: linear-gradient(45deg, #f06, yellow);
min-height: 100%; padding-top: 55px; }

#wrapper { display: block; max-width: 1100px; min-width: 700px; margin: 0 auto; }

jakerocheleau

/**
 * columns-test-2-fixed-widths
 * source: http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks
 */

html { background: #f06;
background: linear-gradient(45deg, #f06, yellow);
min-height: 100%; padding-top: 55px; }

#wrapper { display: block; max-width: 1100px; min-width: 700px; margin: 0 auto; }

jakerocheleau

/**
 * CSS Liquid Layout (Fluid-Fixed-Fixed)
 */
html {
background: #f06;
background: linear-gradient(45deg, #f06, yellow);
min-height: 100%; }

body { padding-top: 85px; } 
#wrapper { margin: 0 auto; max-width: 1100px; min-width: 650px; background: #fff; }

jakerocheleau

/**
 * 3col Holy Grail
 */
body {
background: #f06;
background: linear-gradient(45deg, #f06, yellow);
min-height: 100%;			
margin: 0;			
padding-left: 200px;   /* LC fullwidth */
padding-right: 210px;   /* RC fullwidth + CC padding */