選択フィールドがあり、何をしても、テキストがボックスの上部にくっつくのを止めることができません。
これがどのように見えるかの例です：
使用するpadding-topと、矢印ボタンも押し下げられますが、これは望ましくありません。私もline-height効果なしで試しました。
関連する CSS は次のとおりです。
#header .nav .misc .search .search_holder .cats select {
width: 111px;
height: 29px;
border-top: 1px solid #97ad00;
border-bottom: 1px solid #97ad00;
border-left: none;
border-right: none;
padding-left: 8px;
font-family: Roboto, Arial;
font-size: 14px;
background: url('../images/search-cats-bg.png') 0 0 repeat-x;
color: #b2b2b2;
}
#header .nav .misc .search .search_holder .cats select option {
padding-top: 5px;
}
#header .nav .misc .search .search_holder .cats select option.last {
padding-bottom: 5px;
}
編集: HTML を追加しました。
HTML:
<div class="cats">
<select id="search_cats" class="search_cats" name="cat">
<option value="all">All Categories</option>
<option value="sports">Sports Cards</option>
<option value="gaming">Gaming Cards</option>
<option value="non-sport">Non-Sport Cards</option>
<option value="supplies" class="last">Supplies & Storage</option>
</select>
</div>
なぜこれを行うのですか?どうすれば修正できますか?
編集：実際には修正できないようです。次の質問が見つかりました：
「Shelly Skeens」からの回答を見ると、FF がビルトインを に設定することを決定したため、オーバーライドできないことがわかりline-heightますnormal !important。
