[Dúvida] Espaçamento do texto justificado | Front-end

Oi, Ana, tudo bem?

Quando utilizamos a propriedade text-align: justify; em CSS para justificar o texto, pode realmente ocorrer um espaçamento irregular entre as palavras, especialmente em parágrafos mais curtos ou com palavras longas. Isso acontece porque o navegador tenta esticar o texto para que as linhas ocupem completamente a largura do container, o que pode resultar em grandes espaços entre as palavras.

Uma forma de suavizar esse efeito é utilizando a propriedade hyphens juntamente com text-align: justify;. A propriedade hyphens permite que as palavras sejam corretamente hifenizadas quando necessário, o que pode ajudar a distribuir melhor o texto e reduzir os espaços irregulares. Aqui está um exemplo de como você pode aplicar isso no seu CSS:

p {
  text-align: justify;
  hyphens: auto;
}

Certifique-se de que o idioma da página está definido corretamente, pois a hifenização depende do idioma para funcionar corretamente. Por exemplo, se sua página está em português, você deve incluir a tag <html lang="pt-br">.

Todavia, vale ressaltar que como não tenho acesso ao cenário completo do projeto, outros testes terão de ser feitos a fim de obter o resultado esperado, mas espero que esta resposta seja um bom ponto de partida para a resolução do seu problema.

Espero que dê tudo certo. Abraços!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!