Bonjour à tous,

Voilà j'ai un problème dans mon footer, j'ai placé un float: left pour un <ul> qui se postionne correctement et j'ai centré un autre <ul>, mais je voudrais que mon 3 <ul> soit en float: right.

Il se met en float right met il n'est pas aligné aux deux autres <ul> , et je n'arrive pas à trouver pourquoi. 

Quelqu'un serait-il m'aider ? Je vous joint mon code html et css.

Merci d'avance!

-
Edité par VirginieD7 15 mai 2022 à 17:29:59

Bonjour, Pas d'image de code totalement inutilisable par copier/coller pour tests éventuels.

Le message qui suit est une réponse automatique activée par un membre de l'équipe. Les réponses automatiques leur permettent d'éviter d'avoir à répéter de nombreuses fois la même chose, ce qui leur fait gagner du temps et leur permet de s'occuper des sujets qui méritent plus d'attention.
Nous sommes néanmoins ouverts et si vous avez une question ou une remarque, n'hésitez pas à contacter la personne en question par Message Privé.
Pour plus d'informations, nous vous invitons à lire les règles générales du forum

Merci de colorer votre code à l'aide du bouton Code

Les forums d'Openclassrooms disposent d'une fonctionnalité permettant de colorer et mettre en forme les codes source afin de les rendre plus lisibles et faciles à manipuler par les intervenants. Pour cela, il faut utiliser le bouton de l'éditeur, choisir un des langages proposés et coller votre code dans la zone prévue. Si vous utilisez l'éditeur de messages en mode Markdown, il faut utiliser les balises <pre class="brush: xml;">Votre code ici</pre>.

Merci de modifier votre message d'origine en fonction.

Liens conseillés

• Charte de bonne conduite
• Règles générales du forum

Bonjour, la balise center est obsolète depuis plus de 20 ans => à supprimer de toute urgence.

Je vous recommanderais de vous tourner vers le module flexbox pour ce que vous souhaitez faire.

Bonjour,

Attention : ne pas utiliser <center>, déprécié depuis... des lustres

Sinon pour la question du float:right, ne jamais oublier la notion de flux :

le code est lu de haut en bas et exécuté par le navigateur au fur et à mesure des balises trouvées et du css associé.
Les lignes sont remplis au fur et à mesure.
Un peu comme avec une machine à écrire, ou un traitement de texte.

Quand le navigateur lit ul1, il l'écrit à gauche.
Quand il lit ul2, il l'écrit à la droite et prend tout l'espace restant, puisque on n'a pas indiqué de style.
Il arrive donc en dessous des deux ul, et il met l'ul3 flottant à droite, mais en dessous des deux autres.

la solution est d'écrire dans le html, ul3 avant ul 2

Cependant, l'utilisation des flottants n'est pas judicieuse : aujourd'hui on dispose de flex, beaucoup plus souple, rapide et parfaitement reconnu.

Je te conseille fortement de passer ton footer en flexbox, et tout s'affichera correctement avec deux ou trois instructions

-
Edité par ChrisLebure 15 mai 2022 à 18:31:46

Merci pour vos réponses, je vais essayer en flexbox.

Et du coup, non je savais pas que la balise center était très vielle, je l'ai trouvé sur un forum 😅

En effet <center></center> est déprécié, pour centrer, il est préférable d'utiliser margin et auto.

Pour créer les 3 colonnes et les positionner correctement, on peut utliser flex en créant par exemple un contenant, par exemple .container, dans  celui celui on crée les 3 listes. Il faut ensuite styliser .container avec display : flex. Puis il faut faire le style pour les listes, par exemple avec un .container > *  et flex : 1.

Cela devrait faire 3 colonnes. A noter que dans ce cas, il faudra mettre une marge.