Подскажите пожалуйста, как увеличить блок main, так чтобы он прилегал к футеру, при этом футер должен нормально отображаться.
код>>>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="" xml:lang="en" lang="en">
<head>
<title></title>
<style type="text/css">
*{margin: 0; padding: 0;}
html, body{height: 100%;}
#content{min-height: 100%;}
* html #content{height: 100%;}
#main{padding-bottom: 5em; width: 7em; background: #F00;}
#footer{height: 5em; position: relative; margin-top: -5em; background: #DDD;}
/*]]>*/
</style>
</head>
<body>
<div id="content">
<div id="main">
asd
asd
asd
asd
asd
asd
asd
asd
asd
asd
asd
</div>
</div>
<div id="footer">
asd
</div>
</body>
</html>