Arquivo index.htlm

<!DOCTYPE html>
<html lang=”pt-br”>

<head>
<meta charset=”utf-8″>
<title>Gestão de Ativos</title>
<link rel=”stylesheet” href=”_css/estilo.css”>
</head>

<body>
<div class=”principal”>
<header><strong>INFORMAÇÕES DE SOFTWARE</strong></header>
<nav>
MENU
</nav>
<section>CONTEÚDO</section>
<aside>CONTEÚDO RELACIONADO</aside>
<footer>RODAPÉ</footer>
</div>
</body>

</html>

Arquivo estilo.css

*{
margin:0px; /*distância da parte externa do objeto*/
padding:0px; /*distância da parte interna*/
font-family: Arial;
}

.principal{
background-color: #ccc;
width: 1850px;
margin: auto;
margin-top: 20px;
padding: 5px;
}

header{
background-color: #ccc;
width: 1850px;
height: 40px;
text-align: center;
color: #fff;
font-size: 30px;
}

nav{
background-color: #fff;
margin-top: 5px; /*distância do menu ao cabeçalho a partir do topo*/
width: 1850px;
height: 50px;
}

section{
background-color: #fff;
margin-top: 5px;
width: 1500px;
height: 500px;
float: left;
}

aside{
background-color: #fff;
width: 345px;
margin-top: 5px;
height: 500px;
float: left;
margin-left: 5px;
margin-bottom: 5px;
}

footer{
background-color: #fff;
width: 1850px;
height: 60px;
clear: both;