bonjour, j'ai un petit problème de css, j'ai déjà recherché sur le net et d'après ce que j'ai pu lire, lorsqu'on place 2 blocs div, il se placent de manière naturelle l'un en-dessous de l'autre car ils occupent 100% de la largeur de l'espace qui leur est fourni et si on veut les mettre l'un à côté de l'autre il faut utiliser la propriété float

pourquoi mes 6 mots dans le code suivant sont-ils tous dans la même ligne ?

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
    <div>
      <div style="float: left; width: 100px;">mot1</div>
      <div style="float: left; width: 100px;">mot2</div>
    </div>
    <div>
      <div style="float: left; width: 100px;">mot3</div>
      <div style="float: left; width: 100px;">mot4</div>
    </div>
    <div>
      <div style="float: left; width: 100px;">mot5</div>
      <div style="float: left; width: 100px;">mot6</div>
    </div>
je précise que le tout est contenu dans un div de largeur supérieure à 600px.

je schématise : je voulais que l'affichage se fasse ainsi :

# #
# #
# #

et non ainsi :

# # # # # #

merci d'avance