Как стилизация input range, а конкретно у меня ползунок больше полосы прокрутки и нужно, чтобы тень не выходила за границы

input[type='range'] {
  overflow: visible;
  width: 639.5px;
  height: 12px;
  background-color: rgb(105, 122, 217, 0.302);
  -webkit-appearance: none;
}

input[type=range]:focus {
  outline: none;
}

input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: 60px;
  width: 60px;
  background-image: url('../../../image/Polygon\ 1\ copy.svg');
  cursor: pointer;
  margin-top: -30px;
  box-shadow: -639.5px 0px 1px 639.5px rgba(202, 3, 3, 1);
  /* Добавляем классные эффекты для слайдера! */
}

input[type='range']::-webkit-slider-runnable-track {
  height: 10px;
  -webkit-appearance: none;
  color: #13bba4;
  margin-top: -1px;
}
<input type="range">

введите сюда описание изображения


Ответы (0 шт):