Rodapé fixo no final da página

Olá, pesquisei sobre como colocar o rodapé fixo no final da página independente do tamanho do conteúdo e achei um tutorial do maujor que peguei como exemplo, porém encontrei um problema que não sei como solucionar.

Aqui está o link do tutorial do maujor: http://maujor.com/tutorial/rodape-embaixo-da-janela.php

E aqui estão meus códigos:

CSS

<style type="text/css" media="all">
* {margin:0;padding:0;}
html, body {height:100%;}
body {background:#ddd;color:#666;font:75%/1.4 Verdana, Arial, Helvetica, sans-serif;text-align:center;}
#tudo {width:760px;position:relative;background:#fff;margin:0 auto;text-align:left;min-height:100%;}
* html #tudo {height:100%;}
#topo {background:#cfc;width:760px;height:100px;text-align:center;}
#principal {width:510px;padding:20px;float:left;}
#auxiliar {width:150px;float:right;padding:20px;height:300px;background:#ccc;}
#rodape {background:#b0f1b0;width:760px;height:20px;position:absolute;bottom:0;text-align:center;}
h2 {font:bold 22px Arial, Helvetica, sans-serif;color:#060;}
.clear {clear:both;}
</style>

HTML

<div id="tudo">
	<div id="conteudo">
 <div id="topo">
 <h2>Topo</h2>
 </div>
 <div id="principal">
 <h2>Coluna principal</h2>
 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi eleifend, purus quis laoreet faucibus, ante augue malesuada mi, id rhoncus augue lorem eget elit. Ut sollicitudin sodales purus. Phasellus libero felis, blandit nec, commodo ut, imperdiet ut, nibh. Suspendisse potenti. Donec ullamcorper cursus dolor. Duis vitae ipsum.</p>
 <p>Maecenas dapibus hendrerit diam. Morbi varius, massa id pretium accumsan, nunc lorem congue libero, ut euismod metus libero id nulla. Duis posuere odio sed velit vulputate venenatis. Suspendisse et dui ac metus auctor fringilla. Curabitur interdum augue a pede.</p>
 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi eleifend, purus quis laoreet faucibus, ante augue malesuada mi, id rhoncus augue lorem eget elit. Ut sollicitudin sodales purus. Phasellus libero felis, blandit nec, commodo ut, imperdiet ut, nibh. Suspendisse potenti. Donec ullamcorper cursus dolor. Duis vitae ipsum.</p>
 <p>Maecenas dapibus hendrerit diam. Morbi varius, massa id pretium accumsan, nunc lorem congue libero, ut euismod metus libero id nulla. Duis posuere odio sed velit vulputate venenatis. Suspendisse et dui ac metus auctor fringilla. Curabitur interdum augue a pede.</p>
 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi eleifend, purus quis laoreet faucibus, ante augue malesuada mi, id rhoncus augue lorem eget elit. Ut sollicitudin sodales purus. Phasellus libero felis, blandit nec, commodo ut, imperdiet ut, nibh. Suspendisse potenti. Donec ullamcorper cursus dolor. Duis vitae ipsum.</p>
 <p>Maecenas dapibus hendrerit diam. Morbi varius, massa id pretium accumsan, nunc lorem congue libero, ut euismod metus libero id nulla. Duis posuere odio sed velit vulputate venenatis. Suspendisse et dui ac metus auctor fringilla. Curabitur interdum augue a pede.</p>
 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi eleifend, purus quis laoreet faucibus, ante augue malesuada mi, id rhoncus augue lorem eget elit. Ut sollicitudin sodales purus. Phasellus libero felis, blandit nec, commodo ut, imperdiet ut, nibh. Suspendisse potenti. Donec ullamcorper cursus dolor. Duis vitae ipsum.</p>
 <p>Maecenas dapibus hendrerit diam. Morbi varius, massa id pretium accumsan, nunc lorem congue libero, ut euismod metus libero id nulla. Duis posuere odio sed velit vulputate venenatis. Suspendisse et dui ac metus auctor fringilla. Curabitur interdum augue a pede.</p>
 </div>
 <div id="auxiliar">
 <h2>Coluna auxiliar</h2>
 </div>
 <div class="clear"></div>
	</div>
	<div id="rodape">
 <p>rodape</p>
	</div>
</div>

PROBLEMA - No meu caso eu precisava que o rodapé tivesse uma altura de 300px. Porém quando eu coloco um height na div do rodapé, esta "come" o conteúdo. Peguem meu código e alterem a altura da div rodapé para 300px para verem.

Alguma idéia para arrumar isto?

Muito obrigado pela atenção =D