как сделать маленькие значки видимыми в правой части выделенного фона

#javascript #jquery #html #css

#javascript #jquery #HTML #css — код

Вопрос:

Когда я добавляю маленькие значки для ввода в качестве фона со стилем no-repeat right center , они выглядят великолепно.

Но если я попытаюсь сделать то же самое для выбора тега вместо тега ввода, то у меня возникнет проблема, я не вижу значок, вероятно, потому, что правая сторона выбора закрыта треугольником выбора (выпадающая кнопка). Есть ли какой-нибудь способ «отступить вправо» от этого фонового изображения? использование css или jquery или чего-то еще

Комментарии:

1. выберите треугольник… вы имеете в виду раскрывающуюся кнопку?

2. да, он находится с правой стороны и имеет собственную ширину. сам значок имеет почти тот же размер, поэтому эта выпадающая кнопка блокирует значок

Ответ №1:

Вы должны иметь возможность использовать значения px или% для более точного позиционирования изображения bg, например:

 no-repeat 95% center
 

Кроме того, вам может потребоваться увеличить padding-right select

Комментарии:

1. странная вещь, но при вводе это работает нормально. Я имею в виду, я вижу, что значок немного сдвинулся влево. Но в select вообще нет значка. Я даже сделал 50%, и при вводе он попал в центр, но при выборе я его не вижу. может быть, у select нет стиля фона?

2. Элементы формы очень сложно стилизовать с помощью чистого CSS из-за отсутствия согласованности в браузере. Есть плагин, который помогает, или вы можете обмануть, заменив select на div.