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;
}