Loading
Mostrar mensagens com a etiqueta web. Mostrar todas as mensagens
Mostrar mensagens com a etiqueta web. Mostrar todas as mensagens

sexta-feira, 9 de março de 2012

Alinhamento ao centro de blocos HTML sem largura definida

Enquanto o alinhamento centrado de um bloco, para o qual sabemos a sua largura, é relativamente simples via CSS com margens laterais definidas automaticamente (exemplo: margin-left: auto; margin-right: auto), já o mesmo alinhamento num bloco com largura variável requer um pequeno truque de CSS e HTML.

Então, como alinhar qualquer bloco ao centro?

HTML:
<div class="centered-block">
  <div class="outer-block">
    <div class="inner-block">
      <!-- bloco(s) a alinhar ao centro -->
    </div>
  </div>
  <div class="clear"></div>
</div>
CSS:
.outer-block, .inner-block {
  float: right;
  position: relative;
}
.outer-block {
  right: 50%;
}
.inner-block {
  right: -50%;
}
.clear {
  clear: both;
}
Exemplo:
Bloco DIV com width:auto para reset de largura
alinhado ao centro.

quarta-feira, 22 de abril de 2009

a pequenez na ambição e a grandiosidade para fazer asneira.

Ambas (ver título) corroem valores fundamentais como a funcionalidade, a objectividade, o pragmatismo ou até mesmo o bom senso.

É quase como a ideia de permitir ao povo comentar alinhamentos esporádicos de horóscopos.

Haja paciência.