styling di tipo di input

Question

Creo uno slider con due gestori, per ottenere che inserisca un intervallo di tipi di input sull'altro, il cursore funzioni correttamente ma su di esso c'è una strana linea e non riesco a capire cos'è:

HTML:

<section data-range-slider 
      class="range-slider" 
      ng-model="range" 
      min="0" 
      max="max"> 
<input list="numbers" type="range" ng-change="_which = 0" ng-model="_model[0]" min="0" max="1800" step="1" > 
<input type="range" ng-change="_which = 1" ng-model="_model[1]" min="0" max="1800" step="1"> 
</section> 

SASS:

section.range-slider 
    overflow: hidden 
    position: relative 
    width: 200px 
    height: 35px 
    input 
     pointer-events: none 
     position: absolute 
     overflow: hidden 
     left: 0 
     top: 0 
     width: 200px 
     outline: none 
     height: 18px 
     &::-webkit-slider-thumb 
     pointer-events: all 
     position: relative 
     z-index: 1 
     outline: 0 
     &::-moz-range-thumb 
     pointer-events: all 
     position: relative 
     z-index: 10 
     -moz-appearance: none 
     background: linear-gradient(to bottom, #ededed 0%, #dedede 100%) 
     width: 11px 
     &::-moz-range-track 
     position: relative 
     z-index: -1 
     background-color: rgba(0, 0, 0, 0.15) 
     border: 0 
     &:last-of-type::-moz-range-track 
     -moz-appearance: none 
     background: none transparent 
     border: 0 

    ul.from-to 
    display: block 
    list-style-type: none 
    margin-top: 10px 
    font-family: Arial, Tahoma, Verdana, Arial, Helvetica, sans-serif 
    font-size: 11px 
    li 
     margin-bottom: 1px 
     label 
     background-color: rgba(0, 0, 0, 0) 
     height: 24px 
     line-height: 24px 
     display: inline-block 
     width: 60px 
     padding: 0 10px 
     float: left 
     font-size: 9px 
     color: rgba(0, 0, 0, 0) 
     text-transform: uppercase 
     input 
     border: 1px solid rgba(0, 0, 0, 0.1) 
     padding: 0 8px 
     height: 24px 
     line-height: 24px 
     outline: none 

Questa riga è una pseudoelemento o qualcosa di tipo input = "intervallo" elemento? Come posso rimuoverlo?

Answer 1

Aggiungere questo all'ingresso per sovrascrivere gli stili del browser di default:

&::focus 
    outline: none 
    -moz-box-shadow: none 
    -webkit-box-shadow: none 
    box-shadow: none