Posicionamento de texto à direita em um rodapé flexível usando propriedades Flex

Ao tentar alinhar o texto à direita em um flex container usando a propriedade float , você poderá encontrar problemas. Isso ocorre porque a propriedade float não é suportada em contêineres flexíveis.

De acordo com a especificação do flexbox, "float e clear não criam flutuação ou liberação de item flexível e não o tiram do fluxo. " Em vez disso, ele estabelece um novo "contexto de formatação flexível" para seu conteúdo, o que significa que os pontos flutuantes são ignorados e as margens não são recolhidas com o conteúdo do contêiner.

Para posicionar o texto à direita em um rodapé definido para exibição flexível, use propriedades flexíveis. A propriedade justificar-content pode ser usada para alinhar elementos horizontalmente dentro do contêiner. Por exemplo, no snippet de código fornecido:

footer {
    display: flex;
    justify-content: flex-end;
}

Este código alinhará à direita o intervalo que contém o texto "foo link" dentro do elemento de rodapé.