1

Как сделать чтобы и при нажатии на картинку выползал список ?

div{
  position: relative;
  width:216px;
  height: 30px;
  margin-top: 10px;
}
select{
  width:100%;
  height: 100%;
  padding-left: 50px;
  background: linear-gradient(to left, #007A31 25px, white 25px, white 100%);
  
}

div img{
	position: absolute;
	right: 4px;
	top: 7px;
}
<div>
<select>
  <option>Пункт 1</option>
  <option>Пункт 2</option>
</select>
<img src="css/profi-overalls-catalog.png" alt="">
</div>

1 ответ 1

1

Можно задать картинке pointer-events: none:

div {
  position: relative;
  width: 216px;
  height: 30px;
  margin-top: 10px;
}

select {
  width: 100%;
  height: 100%;
  padding-left: 50px;
  background: linear-gradient(to left, #007A31 25px, white 25px, white 100%);
}

div img {
  position: absolute;
  right: 5px;
  top: 0;
  width: 16px;
  height: 32px;
  pointer-events: none;
}
<div>
  <select>
    <option>Пункт 1</option>
    <option>Пункт 2</option>
  </select>
  <img src="http://cdn.mysitemyway.com/etc-mysitemyway/icons/legacy-previews/icons/firey-orange-jelly-icons-media/003158-firey-orange-jelly-icon-media-media2-arrow-down.png"/>
</div>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.