mise en page (liste déroulante) select multiple

Bonjour à tous,

J'ai un problème de mise en page, d'alignement pour être plus précis, dans une liste déroulante.

Je m'explique, je récupère de données d'une BDD, on va dire un tableau de 4 colonne.

Je veux afficher le résultat dans une liste déroulante.
Comment faire pour que mes données soient aligné sous forme de colonne?

je ne veux pas ça :
col1nom col2nom col3nom col4nom
col1nom_dddd col2nom_dddd col3nom_dddd col4nom_dddd

Comment faire pour avoir

Code:

---

1 2 3

col1nom col2nom col3nom col4nom col1nom_dddd col2nom_dddd col3nom_dddd col4nom_dddd

---

Merci à tous

les listes déroulantes ne sont pas vraiment faites pour faire de la mise en forme...

ça va te demander de jouer avec pas mal de trucs (et faire du code pas super propre...)

le mieux que je puisse te conseiller, est de faire un tableau (données tabulaires ;) donc alignement = pas de problème ^^) qui aura pour première colonne un checkbox sur chaque ligne...
pas de différence de traitement avec le select multiple (c'est :king: ;)) et affichage nettement plus sympa ^^

en plus en jouant un peu avec le CSS (height + overflow) tu peux même rajouter un petit scroll sur ton tableau histoire d'avoir une pseudo liste déroulante ^^

Merci Swoög !!!!
C'est ce que je me suis dit, alors j'ai fait un tableau avec les checkbox:king:
Mais la très trééééés bonne idée que tu me souffle (height + overflow) m'apporte une pleine satisfaction.

Car si au départ, je voulais faire un select c'était parce que je voulais avoir un ascenceur!!!

En fait je n'arrive pas à faire l'ascensceur

Code:

---

<table style="width:100%;height:10px;overflow:auto">

---

Où que je me suis trompé?

Ok, j'ai mis le tableau dans un div et c'est à lui que j'applique la hauteur + overflow....

le code que tu donnes devrait fonctionner...

tu peux en montrer un peu plus ? ;)

Pour l'overflow dans le tableau qui marchait pas c'est ça :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13

<table style="width:100%;height:50px;overflow:auto"> <tr> <td>dsfsqd </td> </tr> <tr> <td>dsfsqd </td> </tr> <tr> <td>dsfsqd </td> </tr> etc --- </table>

---

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

Pour le tableau dans le div qui marche c'est ça <div style="width:100%;height:50px;overflow:auto"> <table style="width:100%;"> <tr> <td>dsfsqd </td> </tr> <tr> <td>dsfsqd </td> </tr> <tr> <td>dsfsqd </td> </tr> etc --- </table> </div>

---

Si tu me trouve une soluce avec le tableau ca me va bien parce que j'ai des entetes de tableau (th) et forcement, quand je scrolle dans le div, et benh, je ne les vois plus ces entetes

je pourrais te proposer ceci, mais si ça fonctionne pas... ça fonctionne pas ;)

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

<table style="width : 100%"> <thead> <tr> <th>tete1</th> <th>tete2</th> </tr> </thead> <tbody style="height : 50px; overflow : auto"> <tr> <td>1.1</td> <td>1.2</td> </tr> <tr> <td>2.1</td> <td>2.2</td> </tr> </tbody> </table>

---

Bon 1 bonne et une mauvaise nouvelle :

Ca fonctionne ... et ca fonctionne pas,
je te laisse devinez quel navigateur ne fonctionne pas:roll:...

Dommage, solution extremement elegante, dommage, qu'on ne voit pas l'ascensceur par contre. Ergonomiquement parlant, on ne voit pas tout de suite qu'on peut scroller.