Alinhando dois parágrafos com um pouco de gambiarra

Henrique Melanda
Dec 24, 2016 · 2 min read

Essa semana me deparei com um texto inocente no rodapé do site, porém na hora de colocar ele no código percebi uma pegadinha.

Coloquei cada linha em um parágrafo e no css usei a propriedade text-align: justify sem mistério.

Só que na hora de ver o resultado olhei que não ficava alinhada que nem o layout, aí foi que percebi a pegadinha.

A segunda linha tem mais palavras do que a primeira, e para compensar isso o designer resolveu colocar um espaçamento lateral na primeira linha.

Eureca…. vou usar letter-spacing, pronto problema resolvido bora mandar o código para produção.

Mas então me veio a mente, e se o texto mudar amanhã?

Além do trabalho de alterar o texto vou ter que ir no css e mudar o espaçamento, e se for outro desenvolvedor que for fazer a manutenção, ele vai saber que tem que alterar no css?

Ai que entra a gambiarra, vamos colocar no css um after.

Agora se alterar o texto ele continua justificado.

É isso galera, espero que tenham gostado!!!!

Henrique Melanda

Written by

Entusiasta pelo estudo de novas tecnologias, por projetos open source e CSS Evangelista.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade