select:focus {width:auto;}

私はCSSの問題があり、それを修正する方法がわかりません。 ドロップダウンリストを展開するには、以下のCSSを使用する必要があります。 1つの条件でのみ正常に動作します。オプションを選択すると、選択範囲が初期幅に戻りません。なぜ??? :( これはIEのためIE8を含むすべてのブラウザで発生したい動作です。フォーカスに幅を設定する必要があります。

select:focus{
    min-width:158px;
    width:auto;
}

fiddle: http://jsfiddle.net/DCjYA/304/

1
"オプションを選択すると、選択が初期幅に戻りません" - これはどうやっていますか?
追加された 著者 Diodeus - James MacFarlane,
:focus の代わりに:hover を使用したいと思うかもしれません。 @Wombatで述べたように、あなたが何か他のものをクリックするまで、選択ボックスはフォーカスされています
追加された 著者 My Head Hurts,
良い点 - IEの選択ボックスは難しい小さな生き物だと思われる。
追加された 著者 My Head Hurts,
選択肢をリストから選択するために選択項目を展開します。リストからオプションを選択した後、選択項目は自動幅で元のサイズに拡大されません。
追加された 著者 BurebistaRuler,
うーん、興味深いIE8で動作しません
追加された 著者 BurebistaRuler,
はいIEは愚かなブラウザですが、世界のほぼすべての企業がその愚かなブラウザの内部アプリケーションを使用します:(((
追加された 著者 BurebistaRuler,

3 答え

これをチェック! IE上のコンボボックスに関する問題を解決すると思います。

http://www.andreabianchin.it/jquery-skinner/

1
追加された

擬似CSSクラス:フォーカスは選択されている間(強調表示された青色の間)、何か他のものをクリックすると、それはあなたの最小幅に縮小されます

0
追加された
あなたはなぜそれを拡大したいのですか?誰かがそれをクリックすると、技術的には、利用可能なすべてのオプションを見ることができるので、必要ではないように見えるときに展開することを意味します
追加された 著者 zero,
うーん...あなたはユーザーが選択したボックスをクリックして拡大したいので、オファーの説明を読むことができるようになるが、一度選択するとオファーが縮小される最小幅の権利ですか?
追加された 著者 zero,
また、ホバリングはie8でバグですが、あなたの唯一のnon-jsソリューションのようです
追加された 著者 zero,
ここでは、外部ファイルで使用できるjqueryの方法を示します:$( '。styleDDC')hover(function(){$(this).css( 'width'、 'auto');}、function(){ $(this).css( 'width'、 '158px');})
追加された 著者 zero,
ここでそれは動作しています: jsfiddle.net/DCjYA/308 これを使用する必要はありません。インラインではなく、すべてのページとie7と8で使用できます
追加された 著者 zero,
はい、私は知っているが、私は左にテキストエリアがあり、フォーカスは選択幅の自動でオーバーライドされたままです。
追加された 著者 BurebistaRuler,
私はこれを望んでいます。なぜなら、このコントロール(選択)を使用して、一部のモバイル・オファーを長い説明で保持していて、オファーの説明を拡張することができない場合は、読むことができないからです。他のコントロールをオーバーライドするので、クリック時に元の幅に戻りたいと思います。
追加された 著者 BurebistaRuler,
@wombatはいこれは私が必要なものです!
追加された 著者 BurebistaRuler,
ありがとうございました !!!!!
追加された 著者 BurebistaRuler,

変更後、要素のフォーカスを失わせる必要があります。

追加:

onchange="this.blur()"

このような: