How to make this div 100% height?

Ha, nice one Paul. I was just going to post another modified version of something you’ve done in the past, so I might as well post it anyway.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
body, html {
	height:100%;
	background:#000;
	margin:0;
	padding:0;
}
.wrapper {
	height:100%;
	width:100%;
	background:#333;
	display:table;
}
.tr {display:table-row}
.tc {
	display:table-cell;
	vertical-align:top
}
.footer {
	height:1px;
	background:orange
}
.header {
	background:red;
	height:1px
}
.inner {
	height:100%;
	background:yellow;
	display:table;
	width:80%;
	margin:auto;
	table-layout: fixed;
}
.main3{background:green}

.inner > div {width: 50%;}
</style>
</head>

<body>
<div class="wrapper">
		<div class="tr">
				<div class="tc header">
						<p>Header section</p>
				</div>
		</div>
		<div class="tr">
				<div class="tc main">
						<div class="inner">
								content
						</div>
				</div>
		</div>
		<div class="tr">
				<div class="tc footer">Footer</div>
		</div>
</div>
</body>
</html>