Fixed width right column with fluid left column
by soulwire
HTML
<div class="wrapper">
<article class="post">
<div class="body">
Body
</div>
<header>
<h1>Header</h1>
</header>
</article>
</div>
CSS
.wrapper {
border: 1px solid red;
margin: 0 auto;
max-width: 400px;
}
article {
overflow: hidden;
}
header {
border: 1px solid green;
}
.body {
border: 1px solid blue;
width: 100px;
float: right;
}
JavaScript
var $wrapper = $( '.wrapper' );
var $template = $( '.post' );
for ( var i = 0; i < 10; i++ ) {
$wrapper.append( $template.clone() );
}