Full height header

HTML & CSS
1

Hey,

I am searching for the code that sets the front page to the display height. For example: http://ournameismud.co.uk The light-blue section will always be as high as the display. height: 100% isn’t working and min-height: 100% neither. What do I have to do to get this result?

Thank you, Paul.

2

Hi,

Do you mean like this?


<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
html, body {
	margin:0;
	padding:0;
	height:100%
}
.wrap {
	min-height:100%;
	background:lightblue;
}
h1 { margin:0 }
</style>
</head>

<body>
<div class="wrap">
		<h1>Test</h1>
</div>
<p>Stuff below the fold</p>
<p>Stuff below the fold</p>
<p>Stuff below the fold</p>
<p>Stuff below the fold</p>
<p>Stuff below the fold</p>
</body>
</html>
3

Exactly! Thank you.