Can't get parent div to expand vertically.

Question

I know the right column floats and I tried a few things I found online but can't get it!
http://thecottagesongoldenpond.com/mc_family.html
AND I'm making all pages from my initial template, so I will need to add "the missing code" to that template - each page may require taller or shorter page..

Answer 1

So for your footer do a clear:
#footer {
          clear: both;  
          background-color: #7D6A8A;
          text-align: center;
          height: 100px;
          width: auto;
          color: #FFFFFF;
          font-size: 13px;
          padding-top: 10px;
          font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
Or you can make a line break do that:
</map>
</div>
<br class="clearfloat />
</div>
and your CSS for the clearfloat class:
.clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the #footer is removed or taken out of the #container */
          clear:both;
          height:0;
          font-size: 1px;
          line-height: 0px;