Centro DIV via jQuery

Question

Eu tenho um rodapé que é fixada no fundo da janela. Eu estou usando jQuery alternância para abrir um cartão de comentário para que os usuários comentário e apresentar:

$('a#footer-comment').click(function() {
  $("#comment-card").toggle(300);
  return false;
  $('#comment-card').show({ position:);
});

$('a#footer-comment-hide').click(function() {
  $("#comment-card").toggle(300);
  return false;
  $('#comment-card').hide();
});

naturalmente se eu não adicionar qualquer seletores CSS para # comment-card que aparece sob o rodapé, e fora da vista.

Então eu acrescentou: {position:absolute; bottom:30px; left:auto;} 30px por isso mostra-se acima do rodapé que é 30px alta .

O problema é que eu não posso chegar a este centro na janela ... se eu usar pixels, dependendo da resolução, ou é muito para a esquerda ou para a direita ... Como faço para centralizar esta na janela

Answer 1

Para centralizar um elemento posicionado de forma absoluta define o seu CSS para isso:

left:50%;
margin-left:-100px;
position:absolute;
bottom:30px;

margem esquerda deve ser de 1/2 da largura da div está a centrar-se, por isso, se o div é 200px de largura uso -100px para sua margem esquerda. Quando a margem for negativo, ele puxa o div em que direcção. Uma vez que começa em 50% em toda a tela, você só vai querer puxá-lo no meio do caminho para o centro de div na tela.