beeblesox/gist:6456053

## gistfile1.html
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>

$(document).ready(function(){

//  $('.nav').sticky({$navWrap: $('.main')});
//	$('.sidebar1').sticky({$boundingBox: $('.main')});
	//$('.sidebar2').sticky({$boundingBox: $('.main')});
});


</script>
	<style>
		* { margin: 0; padding: 0; }
		html, body { height: 100%; }
		table { background: blue; color: white; width: 100%; height: 100%; }
		tr { border: 3px solid red; }
		td { border: 2px solid white; }

		.half { width: 50%; }
		.left { float: left; }
		.right { float: right; }

		.table { display: table; background: red; color: white; width: 100%; height: 100%;}
		.tr { display: table-row; border: 3px solid blue; }
		.td { display: table-cell; border: 2px solid white; }
	</style>
</head>
<body>
<div class="half left">
<table>
	<tr><td>TD</td><td>TD</td></tr>
</table>
</div>
<div class="half right">
<div class="table">
	<div class="tr">
		<div class="td">
			TD
		</div>
		<div class="td">
			TD
		</div>
	</div>
</div>
</div>
</body>
</html>
	<html>
	<head>
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
	<script>

	$(document).ready(function(){

	// $('.nav').sticky({$navWrap: $('.main')});
	// $('.sidebar1').sticky({$boundingBox: $('.main')});
	//$('.sidebar2').sticky({$boundingBox: $('.main')});
	});


	</script>
	<style>
	* { margin: 0; padding: 0; }
	html, body { height: 100%; }
	table { background: blue; color: white; width: 100%; height: 100%; }
	tr { border: 3px solid red; }
	td { border: 2px solid white; }

	.half { width: 50%; }
	.left { float: left; }
	.right { float: right; }

	.table { display: table; background: red; color: white; width: 100%; height: 100%;}
	.tr { display: table-row; border: 3px solid blue; }
	.td { display: table-cell; border: 2px solid white; }
	</style>
	</head>
	<body>
	<div class="half left">
	<table>
	<tr><td>TD</td><td>TD</td></tr>
	</table>
	</div>
	<div class="half right">
	<div class="table">
	<div class="tr">
	<div class="td">
	TD
	</div>
	<div class="td">
	TD
	</div>
	</div>
	</div>
	</div>
	</body>
	</html>