Ola, pessoal,
Estou Estudando a apostila de HTML, CSS e JavaScript da Caelum, só que ao finalizar o código na página 72, o minha página ficou um tanto quanto desconfigurada, nesse caso gostaria de uma ajuda. Não sei se o erro esta em eu utilizar o notepad, porque conferi o código por diversas vezes e mesmo assim fica desconfigurado a página poderiam me auxiliar, segue o código:
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<h1><img src="img/logo.png" alt="Mirror Fashion"></h1>
<p class="sacola">
Nenhum item na sacola de compras
</p>
<nav class="menu-opcoes">
<ul>
<li><a href="#">Sua Conta</a></li>
<li><a href="#">Lista de Desejos</a></li>
<li><a href="#">Cartão Fidelidade</a></li>
<li><a href="sobre_teste.html">Sobre</a></li>
<li><a href="#">Ajuda</a></li>
</ul>
</nav>
</header>
<section id="main"> <!-- Conteudo principal -->
<div class="container destaque">
<section class="busca">
<h2>Busca</h2>
<form>
<input type="search">
<input type="image" src="img/busca.png">
</form>
</section> <!--fim .busca-->
<section class="menu-departamentos">
<h2>Departamentos</h2>
<nav>
<ul>
<li><a href="#">Blusas e camisas</a></li>
<li><a href="#">Calças</a></li>
<li><a href="#">Saias</a></li>
<li><a href="#">Vestidos</a></li>
<li><a href="#">Sapatos</a></li>
<li><a href="#">Bolsas e Carteiras</a></li>
<li><a href="#">Acessórios</a></li>
</ul>
</nav>
</section> <!-- fim .menu-departamentos-->
<img src="img/destaque-home.png" alt="Promoção: Big City Night">
</div> <!-- fim .container .destaque-->
</section> <!-- fim do conteudo principal -->
<section id="destaques">
<!-- Painéis com destaque -->
</section>
<footer>
<!-- Conteudo do rodapé -->
</footer>