Como centralizar uma imagem no CSS

Foi-se o tempo em que um blogueiro precisava de um conhecimento avançado em HTML + CSS se quisesse se aventurar em um novo site/blog sem a ajuda de programadores.

A maioria das empresas de hospedagens oferece a instalação simplificada do WordPress (com poucos cliques) e um sem número de designers disponibiliza temas gratuitos com a qualidade dos templatespremium“.

Entretanto quando queremos customizar, mesmo que minimamente, ainda é necessário conhecer um pouco de programação ou, pelo menos, ter a paciência e perseverança de testar algumas soluções em que os principais buscadores nos oferecem.

Foi assim que hoje precisei personalizar os posts únicos de um blog em que a imagem em destaque aparecia à esquerda e, ao meu ver, ficava mais interessante centralizada.

E como consegui centralizá-la? Pedi para a esquerda caminhar em 50% e a margem direita caminhar -50%. Como assim? Simples, usei o código abaixo:

img {
display: block;
margin-left: 50%;
margin-right: -50%;
}

Use esta mesma solução no seu projeto e verá que a imagem será centralizada! =)

Birimbelo

Descomplicando sua vida digital.

Comentários estão fechados