|
Element's height expands to fill the viewport and below
I would like to know if this effect can be done with a compliant html document (with a doctype) using divs. Element's height expands to fill the viewport when there is little content (no scroll bar) and expands below the viewport as the content grows (scroll bar). This can be demistrated using the following examples. Note these examples work without a doctype defined.
table {
width: 100%;
height: 100%;
border: 1px solid red;
}
<html>
<head>
<title>Example 1</title>
<link rel="StyleSheet" href="example1.css" type="text/css">
</head>
<body>
<table>
<tr><td>
Content Goes Here<br>
</td></tr>
</table>
</html>
<html>
<head>
<title>Example 2</title>
<link rel="StyleSheet" href="example2.css" type="text/css">
</head>
<body>
<table>
<tr><td>
Content Goes Here<br>
Content Goes Here<br>
Content Goes Here<br>
Content Goes Here<br>
Content Goes Here<br>
Content Goes Here<br>
Content Goes Here<br>
etc..
</td></tr>
</table>
</html>
|