3

ここに画像の説明を入力してください幅が200pxで、オーバーフローが非表示に設定されているdivがあります。Firefox、Safari、IEでは、選択はスタイルルールに従い、正しく表示されます。ただし、クロムでは、select要素はルールセットに従わず、div上を流れます。

このサイトはhttp://conaty.hailstormcommerce.com/index.php?route=product/category&path=20にあります。

この問題は、select要素のbackgroundプロパティにありました。

4

3 に答える 3

0

SELECTこのように動作することが知られています。HTMLの要素というよりもOSのコントロールのように動作します（ラジオボタンやチェックボックスのように）。幅がオーバーフローしないように、幅をハードコーディングするだけです。

于 2012-11-27T18:37:32.200 に答える
0

ダイオードの答えに加えて、この要素には220pxの最小幅が指定されています。

これを行う：

width:100%;
min-width:0;
于 2012-11-27T18:57:41.363 に答える
0

あなたはあなたの質問で問題を間違って説明したかもしれないと思います。

select要素のカスタムドロップダウン矢印を作成しようとしているようです。要素は設定したselect正しい幅であり、オーバーフローはdivによって非表示になります。ただし、Chromeでは、selectカスタム矢印を覆う白い背景があり、background: transparent !important;宣言の影響を受けません。

カスタム矢印が透けて見えるようにこれを修正するには-webkit-appearance: none;、以下のように追加する必要があります。

.selectContainer select {
    background: transparent !important;
    cursor: pointer;
    -webkit-appearance: none; /* add this */
}
于 2012-11-28T00:18:56.897 に答える