E aí pessoal! Vou mostrar aqui como centralizar uma div usando CSS.

Primeiramente vamos criar o documento html:

Depois de criado, vem a parte do estilo:

#central {
  width: 300px; /*largura*/
  height: 300px; /*altura*/
  border: solid 1px #000000; /*estilo, tamanho e cor da borda (pra ficar mais fácil a visualização*/
}

Primeiramente, nossa div tem o tamanho de um quadrado de 150px de lado.
Agora, vamos colocá-la em posição absoluta:

#central {
  width: 300px;
  height: 150px;
  border: solid 1px #000000; /*estilo, tamanho e cor da borda (pra ficar mais fácil a visualização*/
  position: absolute;
}

Com nossa div em posição absoluta e com o tamanho pré-estabelecido, vamos atribuí-la os valores para a centralização:

#central {
  width: 300px;
  height: 300px;
  border: solid 1px #000000; /*estilo, tamanho e cor da borda (pra ficar mais fácil a visualização*/
  position: absolute;
  left: 50%; /*posição em relação à parte esquerda*/
  top: 50%; /*posição em relação à parte superior*/
}

Dessa maneira, nossa div estará quase centralizada, porém, o browser interpreta o “ponto zero” para a posição como o canto superior esquerdo da div.

Agora o show!
Com todos os atributos selecionados, vamos colocá-la para ficar centralizada na página:

#central {
  width: 300px;height: 300px;
  border: solid 1px #000000; /*estilo, tamanho e cor da borda (pra ficar mais fácil a visualização*/
  position: absolute;
  left: 50%; /*posição em relação à parte esquerda*/
  top: 50%; /*posição em relação à parte superior*/
  margin-left: -150;
  margin-top: -150;
}

Com as margens em -150 tanto pra cima quanto para a esquerda, ele pega o “ponto zero” e “empurra” a 150 pontos para que o mesmo fique no centro.

Então, nosso código final ficará assim:

Com isso, você pode redimensionar a janela que a div sempre estará no centro.

Legal né?!
Espero que tenham gostado!

Desculpe por não ter instalado o GeSHi! :S

Quem quiser um exemplo:
Clique aqui!