[thelist] ROLL UP! ROLL UP! Who can convert this simple table layout to CSS?

Fri Jul 22 18:54:17 CDT 2011

How's this?

<!DOCTYPE html>
<html>
  <head>
    <meta charset=utf-8" />
    <title>CSS layout</title>
    <style type="text/css">
      * { margin: 0; padding: 0; }
      html, body {
        height: 100%;
      }
      #thecontent{
        width:500px;
        height:100%;
        background-color: rgb(194,224,248);
        margin: auto;
      }
      #header{
        background-color: rgb(224,245,220);
        height: 52px;
        line-height: 52px;
      }
      #postheader p {
        padding-top: 1em;
        background-color: rgb(194,224,248);
      }
    </style>
  </head>
  <body>
    <div id='thecontent'>
      <div id='header'>
          Header here
      </div>
      <div id='postheader'>
        <p>
          Content would go in here. If there isn't enough content to
          fill the screen, this blue section should still stretch to
          the bottom of the window. If there are scrollbars however,
          the blue section should stretch to the bottom of the content.
        </p>
        <p>
          Content would go in here. If there isn't enough content to
          fill the screen, this blue section should still stretch to
          the bottom of the window. If there are scrollbars however,
          the blue section should stretch to the bottom of the content.
        </p>
        <p>
          Content would go in here. If there isn't enough content to
          fill the screen, this blue section should still stretch to
          the bottom of the window. If there are scrollbars however,
          the blue section should stretch to the bottom of the content.
        </p>
      </div>
    </div>
  </body>
</html>