[Zone de liste] Forcer la largeur

Version imprimable

24/07/2006, 09h50
Commodore

[Zone de liste] Forcer la largeur

Bonjour, j'ai une zone de liste déroulante qui contient du texte.
Seulement chaque item est assez long, et la liste s'élargit en fonction de leur taille.
Je voudrais forcer la taille de la liste déroulante pour qu'elle soit plus petite que les textes qu'elle contient.
Sauriez vous me dire comment faire ?
24/07/2006, 09h52
blueice

Je confirme "You are boulet" :mouarf:

Suffit d'indiquer une largeur prédéfinie à la liste :-)
24/07/2006, 09h56
Commodore

boulet, mais pas stupide...
j'ai essayé avant de poser cette question... :?

pour info, voici le bout de code (spip) :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<FORM ACTION="mot.php3" METHOD="get"   >
    <table width=70%>
     <tr><td align=left><li>
      <font  size=4px>Par mots clés</font>
     </td></tr>
 
     <tr><td width=20>
      <SELECT NAME="id_mot" width="10">
      <BOUCLE_menu_mots(MOTS) {tout} {par titre}>
       <OPTION VALUE="#ID_MOT"><font size=1>#TITRE</font></OPTION>
      </BOUCLE_menu_mots>
      </SELECT>
      <INPUT TYPE="submit" NAME="Valider" VALUE="OK">
     </td></tr>
    </table>
    </FORM>

en gras les tests rajoutés pour mes tentatives

et comme ca :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
<FORM ACTION="mot.php3" METHOD="get">
    <table width="70%">
     <tr><td align=left><li><font size="4"> Par mots clés </font></td>
     </tr>
 
     <tr><td width="20">
      <SELECT NAME="id_mot" width="10">
      <BOUCLE_menu_mots(MOTS) {tout} {par titre}>
       <OPTION VALUE="#ID_MOT"><font size=1>#TITRE</font></OPTION>
      </BOUCLE_menu_mots>
      </SELECT>
      <INPUT TYPE="submit" NAME="Valider" VALUE="OK">
     </td></tr>
  </table>
</FORM>

24/07/2006, 10h13
Commodore

ça ne change rien...
24/07/2006, 10h19
blueice

Le mieux serait de nous donner un lien que l'on puisse visualiser...

Et je pense que se serait plus simple sans tableau !
24/07/2006, 10h25
Commodore

je e peux pas changer pour le tableau. En fait, je modifie le code d'une appli dejà existante et pour laquelle toute la mise en page a été faite avec des tableaux (erf)
Il s'agit d'un intranet fait en SPIP (je ne sais pas si tout le monde connait)...
enfin, bref, tout ça pour dire que je ne peux pas faire sans le tableau.

Le mieux serait de mettre un scroll horizontal dans le select mais je ne sais pas si c'est possible.

voici une capture d'écran

[edit] le select en cause est celui où il y a écrit absents.csv, notez bien qu'il déforme la page complètement[/edit]

[edit2]
screenshot retiré cause: dépassement de quota
[/edit2]
24/07/2006, 10h39
blueice
Donne lui une classe par exemple :
Code:

1 2 .leselect { width:100px; }

ça ne marche pas...

CSS:

Code:

1
2
3
4
5
 
.leselect { 
 width:100px;
 overflow:auto;
}

HTML:

Code:

1
2
3
4
5
6
 
<SELECT NAME="id_mot" class="leselect">
      <BOUCLE_menu_mots(MOTS) {tout} {par titre}>
       <OPTION VALUE="#ID_MOT"><font size=1>#TITRE</font></OPTION>
      </BOUCLE_menu_mots>
</SELECT>

24/07/2006, 11h01
blueice

Sous Safari et Firefox ca marche IE Windows je ne sais pas...
24/07/2006, 11h08
Commodore
ZE problem ici est justement que je bosse sous IE (j'aurais préféré de loin FireFox, mais, bon, ne trollons pas...)

je vais essayer de l'inclure dans:
Code:

1 2 3 <div style="overflow:auto; width=100px;"> <select...

bon, ça a l'air presque satisfaisant comme ça:

Code:

1
2
3
4
5
6
7
8
9
10
11
 
<tr><td>
      <div style="overflow:auto; width:200px; height:80px">
      <SELECT NAME="id_mot">
      <BOUCLE_menu_mots(MOTS) {tout} {par titre}>
       <OPTION VALUE="#ID_MOT"><font size=1>#TITRE</font></OPTION>
      </BOUCLE_menu_mots>
      </SELECT>
      <INPUT TYPE="submit" NAME="Valider" VALUE="OK">
      </div>
</td></tr>

24/07/2006, 11h24
Commodore

en tout cas, blueice, merci pour tes conseils :)

c'est un peu toi qui m'a donné cette idée...
et j'ai aussi retiré le boulet de ma signature ^^