0

JQuery モバイルを利用した Web ページ (Android アプリで使用) の一部は次のようになります。

<table style="width:100%">
//here are some other rows with other input fields
<tr>
  <td>Combobox:</td>
  <td>
    <select id="sl_bnd">
      <option value="0">Very very very long text</option>
      <option value="1">Shorty</option>
    </select>
  </td>
</tr>

問題は、「非常に非常に長いテキスト」を選択すると、コンボボックスが広くなり、テーブルの半分が画面の外に表示されることです。

私が望むのは、コンボボックスを固定の初期サイズに設定することです(画面の解像度が異なる場合があるため、これは動的です)。

誰もそれを達成する方法を知っていますか?

4

2 に答える 2

2

作業例: http://jsfiddle.net/Gajotres/HZAnz/

シンプルな CSS を使用するだけです。

.ui-select, #sl_bnd, #sl_bnd option {
    width: 200px !important;
}

パーセンテージを使用することもできます:

.ui-select, #sl_bnd, #sl_bnd option {
    width: 80% !important;
}

または、特定の選択を変更する場合:

#custom-select .ui-select, , #sl_bnd, #sl_bnd option {
    width: 200px !important;    
}

主なことは、!importantデフォルト値をオーバーライドするために使用することです。

オプションの幅だけを変更したい場合は、次の css を使用してください。

#sl_bnd, #sl_bnd option {
    width: 200px !important;    
}
于 2013-07-03T07:14:43.930 に答える