Aligner une liste horizontalement [Fermé]

mikasa - 30 nov. 2016 à 16:31 - Dernière réponse : ZeNairolf 1696 Messages postés vendredi 6 mars 2009Date d'inscription 1 novembre 2017 Dernière intervention
- 2 déc. 2016 à 17:34
Bonjour,
je suis debutante en css :'(
donc voila
je souhaite aligner 4 liste d'elements voici mon code css :
.F1,.F2,.F3,.F4{ 
 display: inline-block ;
 font-size: 12px;
 border : 1px solid red ;
 width:20% ;
 vertical-align: top;
}
.pied-page{
width:100% ;
border : 1px solid red ;
}
et [/contents/498-html-langage html] :

<[/contents/242-introduction-au-dynamic-html-dhtml div] class= "pied-page">
<div class="F1"><!-- 
  --><ul><li><a href=""><h4> Formation </h4></a></li><!--
  --><li><a href=""><h4> Formation </h4></a></li><!--
  --><li><a href=""><h4>Formation </h4></a></li><!--
  --></ul>
</div>
<div class="F2"><!-- 
  --><ul><li><a href=""><h4> Formation </h4></a></li><!--
  --><li><a href=""><h4> Formation </h4></a></li><!--
  --><li><a href=""><h4>Formation </h4></a></li><!--
  --></ul>
</div>

</br>

<div class="F3"><!-- 
  --><ul><li><a href=""><h4> Formation </h4></a></li><!--
  --><li><a href=""><h4> Formation </h4></a></li><!--
  --><li><a href=""><h4>Formation </h4></a></li><!--
  --></ul>
</div>

</br>
  <div class="F4"><!-- 

--><ul><li><a href=""><h4> Formation </h4></a></li><!--
  --><li><a href=""><h4> Formation </h4></a></li><!--
  --><li><a href=""><h4>Formation </h4></a></li><!--
  --></ul>
</div>
  </br></br></br>
bonne journee !!! 


</div>

Afficher la suite 

6 réponses

ZeNairolf 1696 Messages postés vendredi 6 mars 2009Date d'inscription 1 novembre 2017 Dernière intervention - 30 nov. 2016 à 18:30
0
Utile
5
Quand tu dis aligner horizontalement, tu veux dire centrer dans la page? Enfin tu as un exemple?

Et pourquoi il y a des commentaires ouvert entre chaque lignes.
bonsoir
les commentaires entre les lignes c pour eviter un espace entre les elements
je veux un element de la liste a cote de l'autre dans la meme ligne
ZeNairolf 1696 Messages postés vendredi 6 mars 2009Date d'inscription 1 novembre 2017 Dernière intervention - 1 déc. 2016 à 17:04
Déjà les commentaires entre les lignes ne servent à rien, il y aura pas d'espace entre les éléments.

Et si j'ai compris tu veux que tout tes li soit l'un à côté de l 'autre et non l'un en dessous de l'autre? Il faut utiliser un float: left ou display: inline-block sur les li
bonjour
je voudrais savoir sur quoi je dois applique les display: inline-block
ZeNairolf 1696 Messages postés vendredi 6 mars 2009Date d'inscription 1 novembre 2017 Dernière intervention - 2 déc. 2016 à 17:34
Sur les li qui se trouvent dans les ul