28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'aimerais savoir s'il est possible de faire en sorte qu'une même liste affiche ses éléments par colonne de 3, comme ceci :

élément1 élément4 élément7
élément2 élément5 élément8
élément3 élément6 élément9

J'utilise actuellement 3 listes en float mais peut-on faire plus simple ?
Modifié par Relax (18 Aug 2009 - 23:43)
Bonjour,

Il serait plus simple de faire une liste :
élément1 élément2 élément3
élément4 élément5 élément6
élément7 élément8 élément9

En faisant flotter les éléments en en donnant une largeur à UL.

Dans l'autre sens... Je ne vois pas.
Laurie-Anne a écrit :
Dans l'autre sens... Je ne vois pas.

Si la liste est codée et ne provient pas d'une DB tu pourrais toujours l'organisée comme suit:


<ul>
<li>élément 1</li>
<li>élément 4</li>
<li>élément 7</li>
<li>élément 2</li>
<li>élément 5</li>
<li>élément 8</li>
<li>élément 3</li>
<li>élément 6</li>
<li>élément 9</li>
</ul>


mais bon c'est pas évident à mettre en place pour d'une manière automatique (sauf en utilisant peut-être des array)
Salut,

Avec du CSS3 tu peux faire :

<ul class="multiplecolumns">
  <li>Element 1</li>
  <li>Element 2</li>
  <li>Element 3</li>
  <li>Element 4</li>
  <li>Element 5</li>
  <li>Element 6</li>
  <li>Element 7</li>
  <li>Element 8</li>
  <li>Element 9</li>
</ul>


.multiplecolumns
{
  column-width : 80px;
  width : 310px;
}


Mais en attendant, les seules solutions te sont déjà données (d'ailleurs tu en donnes une aussi).