Html, body questions

HTML & CSS
10

In most cases yes this is the bare minimun:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
html,body{height:100%;margin:0;padding:0}
.wrap{
	min-height:100%;
	max-width:960px;
	margin:auto;
	background:red;	
}
</style>
</head>
<body>
<div class="wrap">100%</div>
</body>
</html>

There are cases where setting 100% on html and body could have strange effects and that would be when applying backgrounds to both html and body and then you would get html background at 100% only and the body background below the fold. In most cases you should avoid setting styles on html anyway, apart from height:100% and resetting margin and padding.This is because the body is special and when you apply a background to the body it is automatically propagated to the html element anyway and thus solves any overflow problem.

Actually many so called experts do not understand this properly either :smile: It took me a while to get my head around it.

3 Likes