0

Webページにカスタムドロップダウンがあります。ドロップダウンは、Chrome、Mozilla、IE9、Safariの4つの主要なブラウザで完全に表示されます。ただし、オペラではドロップダウンの画像は表示されません。それを修正するにはどうすればよいですか?これは私のhtmlです。

<div style="width:172px;">
   <div class="blue" style="float: left; width:100%;">
      <div class="lightblueHeading" style="text-align: left;">
         No. Of Guests
      </div>
      <div>
        <div class="styled-select">
           <select name="ctl00$cphMain$ddlNoOfGuest" id="cphMain_ddlNoOfGuest" style="width: 165px;">
            <option value="-1">No. of Guests</option>
            <option value="1">1</option>
            <option selected="selected" value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
            <option value="7">7</option>
            <option value="8">8</option>
            <option value="9">9</option>
            <option value="10">10</option>
            <option value="11">11</option>
            <option value="12">12</option>
            <option value="13">13</option>
            <option value="14">14</option>
            <option value="15">15</option>
          </select>
        </div>
      </div>
    </div>
    <span id="cphMain_cmpval_NoOfGuest" class="validation" style="float:left;display:none;">* - the field is required</span>
  </div>

CSS

.blue {
border: 1px solid #74A4CA;
}

.lightblueHeading {
font-size: 12px;
background-color: #74A4CA;
color: white;
border: 1px solid #74A4CA;
padding-left: 4px;
}

.styled-select {
overflow: hidden;
background: url(../images/signup-dropdown_icon.png) no-repeat right;
background-color: white;
width: 100%;
background-position: 100%;
display: inline-block;
}


.styled-select select {
background: transparent;
width: 110% !important;
line-height: 1;
border: 0;
height: 34px;
-webkit-appearance: none;
-moz-appearance: none !important;
appearance: none;
font-size: 12px;
float: left;
}

これは有効なドロップダウンです

このドロップダウンはオペラで表示されています

4

1 に答える 1

0

Operaは透明な選択背景をサポートしていません。これを試して:

.styled-select select {
  background: rgba(0,0,0,0);
  background: transparent;
  .
  .
  .
于 2013-03-08T16:36:09.377 に答える