title: Square DIV where height is equal to viewport
body: <p>I need to create a DIV where <code>width=height</code>, and <code>height=100%</code> of the viewport (which, obviously, is variable). </p>
  
  <p>In other words, a perfectly square DIV that calculates it's dimensions <strong>based on the height of the viewport</strong>. Elements within that DIV will take their dimensions as percentages of the parent-DIV's height &amp; width.</p>
  
  <p>It seems to me like this should be simple to do <strong>in CSS</strong>, but I've gotten stuck with it! Any pointers would be much appreciated.</p>