私はCSSでスタイル付けした選択ボックスに問題があります。 Chromeでホバーオーバーすると白いボックスが表示されます。 Safariではすべてが正常です。すべての手がかりは? 私はcssとhtmlを追加しました。また、問題の写真も追加しました。最初のものは、サファリであり、2つ目は、クロムChromeを使用した選択した要素の白いボックス
.dropdown {
\t position: relative;
\t margin: 0 auto;
\t top: 10;
\t left 50%;
\t width: 190px;
\t height: 2em;
\t line-height: 2;
\t background: #E9B6B0;
\t overflow:scroll \t ;
\t border-radius: .35em;
\t margin-bottom: 5px;
}
.dropdown select {
\t -webkit-appearance: none;
\t -moz-appearance: none;
\t -ms-appearance: none;
\t appearance: none;
\t background-image: none; /* remove the value that chrome dose not use */
background-color: #E9B6B0; /* set the value it does */
border-radius: 4px; /* make it look kinda like the background image */
border: 1px solid #888;
\t outline: 0;
\t box-shadow: none;
\t border: 0 !important;
\t background: #E9B6B0;
\t width: 100%;
\t height: 100%;
\t margin: 0;
\t padding: 0 0 0 .5em;
\t color: black;
\t cursor: pointer;
\t font-size: 15px;
}
.dropdown::after {
\t content: '\25BE';
\t position: absolute;
\t top: 0;
\t right: 0;
\t bottom: 0;
\t padding: 0 1em;
\t background: #E9B6B0;
\t pointer-events: none;
}
.dropdown:hover::after {
\t color: white;
}
.dropdown::after {
\t -webkit-transition: .25s all ease;
\t -o-transition: .25s all ease;
\t transition: .25s all ease;
}
<div class="dropdown">
\t <select id="genre" onchange="filterConcerts()" value="default">
\t \t <option value="default">Sjanger</option>
</div>
あなたはChromeで実行されている任意のブラウザ拡張を持っていますか?私は拡張機能によって注入されたようなものを見てきました。拡張機能をインストールせずにシークレットウィンドウで表示してみてください。また、Dev Toolsで手がかりを調べてみてください。 – CreMedian
白いボックスは表示されません。あなたはdrodpownのその部分を調べることができますか?疑似セレクタかもしれない? –