Domanda

Ho un piè di pagina che è fissato alla parte inferiore della finestra.Sto usando jQuery toggle per aprire una scheda di commento per gli utenti di commentare e presentare:

$('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 non aggiungere eventuali selettori CSS #comment-carta si presenta SOTTO il piè di pagina, e fuori di vista.

Così ho aggiunto: {position:absolute; bottom:30px; left:auto;} 30px in modo che verrà visualizzato sopra il piè di pagina che è 30px alta.

Problema è che non riesco a ottenere questo centro nella viewport...se io uso pixel, a seconda della risoluzione, non è troppo lontano a sinistra o a destra...come faccio a centro di questo nella viewport?

È stato utile?

Soluzione

Al centro di un posizionamento assoluto elemento di impostare il CSS in questo modo:

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

margin-left dovrebbe essere 1/2 della larghezza del div che si sono centraggio, quindi, se il div è 200px largo uso -100px per il margine sinistro.Quando il margine è negativo, si tira il div in quella direzione.Visto che inizia a 50% attraverso lo schermo, si desidera solo per tirare a metà strada su per centrare il div sullo schermo.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top