Positionnement à droite du texte dans un pied de page Flex à l'aide des propriétés Flex

Lors d'une tentative d'alignement à droite du texte dans un conteneur Flex à l'aide de la propriété float , vous pourriez rencontrer des problèmes. En effet, la propriété float n'est pas prise en charge dans les conteneurs flex.

Selon la spécification flexbox, "float et clear ne créent pas de flottement ou de dégagement de l'élément flexible, et ne le sortent pas du flux. " Au lieu de cela, il établit un nouveau « contexte de formatage flexible » pour son contenu, ce qui signifie que les flottants sont ignorés et que les marges ne s'effondrent pas avec le contenu du conteneur.

Pour positionner à droite le texte dans un pied de page défini sur l'affichage flexible, utilisez plutôt les propriétés flex. La propriété justifier-content peut être utilisée pour aligner des éléments horizontalement dans le conteneur. Par exemple, dans l'extrait de code fourni :

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

Ce code alignera à droite la plage contenant le texte "foo link" dans l'élément de pied de page.