Olá, tudo bom?
Estou com uma dúvida sobre se é permitido, falando em semântica, encapsular o main e aside em uma div para poder centraliza-los na tela, ou se existe uma outra forma melhor pra se fazer isso.
Abraço!
Solucionado
Olá, tudo bom?
Estou com uma dúvida sobre se é permitido, falando em semântica, encapsular o main e aside em uma div para poder centraliza-los na tela, ou se existe uma outra forma melhor pra se fazer isso.
Abraço!
Olá Yuri,
Não impacta muito não, mas como está o seu código? você não consegue usar o próprio <body> ou o próprio <html> para deixa-los centralizados?
Qualquer coisa coloque o seu código aqui para te ajudarmos ;)
O código abaixo é após o header. Eu preciso centralizar o aside que terá uma navegação (a esquerda) e o main que terá o conteúdo da página (a direita), mas se eu deixá-los sem esse encapsulamento da div com a classe container, eles ocupam a tela toda.
Deu um branco, não tenho ideia de como colocá-los ao centro juntos.
<div class="container">
<div class="breadcrumb">
<ol class="breadcrumb-list">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item"><a href="#">Plano de crescimento</a></li>
</ol>
</div>
<h2 class="subtitulo">Plano de Crescimento</h2>
<h3 class="slogan">Viva a beleza das suas escolhas!</h3>
<main class="main">
<section>
<h1>A grande novidade da Consultoria de Beleza Natura!</h1>
</section>
</main>
<!-- Este é o aside da página -->
<aside class="aside">
<nav>
<ul>
<li><a href="#">Plano de crescimento</a></li>
<li><a href="#">Consultoria de Beleza Natura</a></li>
<li><a href="#">Confira sua pontuação</a></li>
<li><a href="#">Cresça com a Natura</a></li>
<li><a href="#">Líder de Negócios Natura</a></li>
<li><a href="#">Folheto completo</a></li>
</ul>
</nav>
</aside>
<!-- Este é o rodapé da página -->
<footer>
</footer>
</div>E aí Yuri,
Dá uma olhada neste Link, é o seu código, olhe que no CSS eu coloquei apenas
main, aside {
display: inline-block;
}
e ele já ficou um do lado do outro, se você tirar a <div> com a class container no começo, ele também mantem um do lado do outro.
Espero ter ajudado.