Div 100%

Desculpa por estar criando um topico desses onde já devem ter outros assim, mas fiz a busca pelo forum e ele retira da busca a palavra DIV..

Estava pesquisando por div 100% e ele me deu a seguinte resposta "As seguintes palavras não são permitidas e e foram removidas de sua pesquisa: div"

Então meu problema é o seguinte... estou montando uma estrutura com DIVs e não to conseguindo fazer a minha DIV pegar 100% do restante da tela.. ele pega o 100% da tela, como eu faço para ela completar apenas o que esta faltando pra tela?

html, body {

height: 100%;
}

body {

background-color: #CCC;
margin: 0px;
}

#tudo {
width: 100%;
height: 100%;
background-color: #CCC;
}

#topo {
width: 100%;
height: 100px;
background-color: #F00;
}

#conteudo {
width: 90%;
height: 100%;
background-color: #FF0;
}

#coluna1 {
width: 300px;
height: 100%;
float: left;
background-color: #FFF;
}

#coluna2 {
width: 300px;
height: 100%;
float: left;
background-color: #00F;
}

 

<div id="tudo">
 <div id="topo"></div>
 <div id="conteudo">
 <div id="coluna1"></div>
 <div id="coluna2"></div>
 </div>
</div>