Выберите текст поля, прикрепленный к верхней части поля в FF

У меня есть поле выбора, и что бы я ни делал, я не могу заставить текст перестать прилипать к верхней части поля.

Вот пример того, как это выглядит:

Если я использую 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>

Почему это происходит и как я могу это исправить?

Изменить: кажется, это невозможно исправить, нашел этот вопрос:

Я хочу выровнять текст по вертикали в поле выбора

Если вы посмотрите на ответ «Шелли Скинс», то обнаружите, что FF решил установить встроенный line-height в normal !important и, следовательно, его нельзя переопределить.