Jag är inte så hemma på CSS men jag har en klass

#content {
	background:#fff;
	padding:1.5em;
	height:100%;
	width:63em;
	overflow:auto;	
	text-align:left;
}

Om du använder den andra klassen inom #content så kan du sätta height:100%.
Om inte så behöver du nog använda nått javascript.

Jag förmodar att du använder en <div id="content"> text <div>
om hade get en mer förklarig av hur de skulle vara plaserade så skulle det vara lättare.

om det är contens och main som ska vara lika så lägg dom inom en div tag som får bestäma höjden för bägge ..........

fix med javascript
http://www.sitepoint.com/article/exploring-limits-css-layout/2

Lättat är att ge bägge fasta mått de skall hålla sig till helst i pixlar. Sätter du det objekt som är ytterst till ex: 500 px så kan du ange det inre till 498 px. Sedan bör du även lägga till top,left och position för att styra själva placeringen. Läs gärna mer på www.webdesignskolan.se

Tack för svaren lutar nog åt att jag får sätta fast höjd på dem som Magnus nämnde