Dividir tela 50% html e css

Estou com um problema ao tentar dividir uma tela utilizando porcentagens, sem utilizar pixels,
o problema ocorre quando eu declaro o doctype no .html, sem declarar o doctype ele funciona como desejo.

Código html

<!-- <!doctype html> se eu comentar essa linha funciona -->
<html lang="pt-br">
<head>
	<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
	<link rel="stylesheet" href="1.css">
	<title>1</title>
</head>
<body>
	<div id="topo1">
	<div id="topo">
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam, sed, perspiciatis natus odio aliquam cupiditate quae inventore doloribus corporis rem necessitatibus similique nihil eius illo id veritatis voluptatibus laboriosam velit!</p>
	</div>
	</div>
	<div id="rodape1">
	<div id="rodape">
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias, eum, magnam, commodi temporibus repellendus voluptatum totam ratione laboriosam amet doloremque perferendis suscipit nam accusamus modi molestias placeat maxime consequatur voluptatibus!</p>
	</div>
	</div>
</body>
</html>

Código css

body {
	margin:0;
	padding:0;
	height:100%;
}

p {
	margin: 0;
	padding-top: 50px;
}

#topo {
	height:50%;
	width:100%;
	background-color:#009900;
	text-align:center;
	border-radius: 0 0 200px 0;
}

#rodape {
	height:50%;
	width:100%;
	background-color:#990000;
	text-align:center;
	color:#FFFFFF;
	border-radius: 200px 0 0 0;
}

#topo1 {
	background-color:#990000;
}

#rodape1 {
	background-color:#009900;
}

posso estar falando asneira mais coloca: onde o doctype esteja maiusculo nao sei se tem algo a ver, mais nao custa tentar.

maaarkin, já tentei mais não rola.
Quando utilizo a clausula doctype, maiúscula ou minuscula, as div fica com o tamanho dos parágrafos ao invés de pegar 50% cada um do body