Layers To:Middle:Bottom

/* CSS layout */
#masthead {
}
#top_nav {
}
#page_content {
}
#footer {
}

<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled 1</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="Untitled_1.css" />
</head>
<body><div id="masthead"></div>
<div id="top_nav"></div>
<div id="page_content"></div>
<div id="footer"></div> </body>
</html>
 

Layer: this example of layering has a bug, that did not allow the main area to be expanded left to create a large text display area. I modified it as need with in-line css coding.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Language" content="en-us" />
<title>Untitled 1</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="Untitled_1.css" />
</head>
<body>
<div id="masthead" style="border:2 px; background-color:gray">
Top </div>
<div id="top_nav" style="border:2 px; background-color: #CDFEF9">
TOP Navigation</div>
<div id="container" style="left: 0px; top: 0px; height: 176px">
<div id="left_col" style="background-color: #F8D7B1; left: 0px; top: 0px; width: 93px; height: 172px;">
div left</div>
<div style="position: absolute; width: 230px; height: 168px; z-index: 1; left: 97px; top: 3px" id="layer_main">
</div>
</div>
<div id="footer" style="background:#ECFFC4">
div footer</div>
</body>

</html>
 

Later this code I added to a FrontPage and reviewed it , as expression web did not have review option.