BigAB
11/22/2012 - 11:04 PM

Body With Padding

Body With Padding

{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
<!-- content to be placed inside <body>…</body> -->
<div class="just a little demo div">
	<p>Some content</p>
	<p>Some content</p>
	<p>Some content</p>
	<p>Some content</p>
	<p>Some content</p>
	<p>Some content</p>
	<p>Some content</p>
	<p>Some content</p>
	<p>Some content</p>
	<p>Some content</p>
	<p>Some content</p>
	<p>Some content</p>
</div>
/**
 * Body With Padding
 * Can't do body with padding (to solve earlier problem)
 * has to be a inner wrapper div. Change '.demo' to
 * 'body' to see what I mean.
 */
html, body {
	position: relative;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0 none;
	background: blue;
}

.demo {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: #f06;
	background: linear-gradient(45deg, #f06, yellow);
	margin: auto;
	overflow: auto;
	color: #eee;
	padding: 1em 2em;
	font-family: "Avant Garde", arial, sans-serif;
	font-size: 2em;
}