输入范围在ie或边缘不起作用

是否有其他人遇到此问题，并且您是否有解决方案？输入范围在ie或边缘不起作用

在ie中使用此html和边缘范围不显示。

<html> 
    <head> 
     <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> 
     <link type="text/css" href="/static/css/bootstrap.min.css" rel="stylesheet"> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
     <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> 

    </head> 
    <body> 
     <div class="container">  
      <div class="row"> 
       <div class="col-sm-4"> 
        <form method="post" action="/Tactics"> 
         <table align="center" width="100%"> 
          <tr><td>stuff</td><td><input type="range" min="10" max="50"></td></tr> 
          <tr><td>stuff</td><td><input type="range" min="10" max="50"></td></tr> 
         </table> 
        </form> 
       </div> 
      </div> 
     </div> 
    </body> 
</html>

如果您为表格中的每一行取出第一个东西，则输入范围会再次运行。在crome，firefox和opera中都很好。

有没有人看过这个，你知道如何解决？

来源

2015-12-29 HenryM

你可以创建一个[小提琴]（HTTP： //jsfiddle.net）能够准确地表示您遇到的问题？我在Edge团队工作，我们希望看看我们能做些什么来改善其他人的体验。 – Sampson

添加MS填料：

input[type=range]::-ms-track { 
/*example */ 
width: 250px;height: 10px; 
background: transparent; 
border-color: transparent; 
border-width: 6px 0; 
color: transparent; 
} 

input[type=range]::-ms-fill-upper { 
background: gray; 
border-radius: 6px; 
} 
input[type=range]::-ms-fill-lower { 
background: gray; 
border-radius: 6px; 
}

这仅仅是例子，但你需要把重点放在这些：

input[type=range]::-ms-track 
    input[type=range]::-ms-thumb 
    input[type=range]::-ms-fill-upper 
    input[type=range]::-ms-fill-lower

检查FIDDLE

来源

2015-12-29 22:04:25 Riskbreaker

输入范围在ie或边缘不起作用

回答

相关问题