Pinceladas da Web

Quando você começa a lhe dar com WebStandards, você acaba descobrindo que a tag <center> caiu em desuso, mas se eu preciso centrar meu layout horizontalmente, de que forma eu vou fazer isso? Através de CSS isso é possível, o que ele faz é o seguinte: Você diz ao browser para colocar uma margem “auto” em ambos os lados do objeto. O valor para “auto” transforma-se na largura da tela menos a largura do objeto dividido por 2. Isto centra o objeto horizontalmente. O código HTML fica da seguinte forma:

<div id="container">
<!-- Conteúdo do site -->
</div>

Esta div “container” deve ser a primeira a ser aberta depois do body e a última a ser fechada, por que é dentro dela que ficará todo o conteúdo do nosso site. Agora observe como fica o código CSS:

body {
  text-align:center;
  margin: 0;
  padding: 0;
}

#container {
  text-align:left;
  margin: 0 auto;
  width:760px;
}

É importante remover o margin e padding de body de modo que nossa div container não seja deslocada por essa margem. Pronto, agora você tem um layout centralizado. Essa técnica visa as pessoas que estão aprendendo WebStandards. Um exemplo de uso dessa técnica é o layout do meu blog, está centrado horizontalmente.