Задать вопрос
@GreenMan1899

Как сверстать такой поиск и выпадающий список [картинка]?

a990786af4e34c778c7c4404a2a0af40.png

Поиск:
1) не знаю как засунуть картинку в placeholder.
2) есть какой-то более изящный способ сделать правый серый бордер высотой и на уровне текста, кроме как background-image?

Выпадающий список:
1) как вообще сделать такую кнопку (стрелки вверх-вниз)? select не кастомизируется насколько я знаю.
2) ну и такой же вопрос, как потом засунуть туда те серые боковые перегородки
  • Вопрос задан
  • 301 просмотр
Подписаться 1 Оценить Комментировать
Решения вопроса 1
1) select кастомизируется;
2) select - этот с кнопками, можете через <ul><li></li></ul> в <div></div>
3)В этом же <div></div> еще один див <div><span>Вверх</span><span>Вниз</span></div>
4)Вверх - Вниз - это ваши стрелочки, через png, svg или fontawesome
5)Слева и справа задать border вашему див <div><span>Вверх</span><span>Вниз</span></div>
Например www.webmasters.by/images/articles/webprogramm/cust...
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 2
@void01
1. никак... бэкграундом, псевдами before after (в сам placeholder никак) скрытие через JS
2. :after {content:'|'} или content:'' но с высотой и бордером

3. бэкграндом + appearence:none;-webkit-appearence:none;
Ответ написан
Комментировать
@Farrien
Tell me who
Нужно создавать псевдо select. Select и option не полностью кастомизируется.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы