fix firefox and ie
This commit is contained in:
parent
54c089583c
commit
36bfc74c58
|
@ -1,7 +1,7 @@
|
|||
.slider {
|
||||
-webkit-appearance: none; /* Hides the slider so that custom slider can be made */
|
||||
width: 100%; /* Specific width is required for Firefox. */
|
||||
background: transparent; /* Otherwise white in Chrome */
|
||||
-webkit-appearance: none;
|
||||
width: 100%;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.slider::-webkit-slider-thumb {
|
||||
|
@ -9,9 +9,9 @@
|
|||
}
|
||||
|
||||
.slider:focus {
|
||||
outline: none; /* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */
|
||||
outline: none;
|
||||
}
|
||||
/*
|
||||
|
||||
.slider::-ms-track {
|
||||
width: 100%;
|
||||
cursor: pointer;
|
||||
|
@ -19,7 +19,7 @@
|
|||
background: transparent;
|
||||
border-color: transparent;
|
||||
color: transparent;
|
||||
}*/
|
||||
}
|
||||
|
||||
.slider::-webkit-slider-thumb {
|
||||
-webkit-appearance: none;
|
||||
|
@ -36,24 +36,38 @@
|
|||
background-color: #4e5b60;
|
||||
border: 1px solid #383739;
|
||||
}
|
||||
/*
|
||||
|
||||
.slider::-moz-range-thumb {
|
||||
border: 1px solid #000000;
|
||||
height: 36px;
|
||||
width: 16px;
|
||||
border-radius: 3px;
|
||||
background: #ffffff;
|
||||
-webkit-appearance: none;
|
||||
border: 1px solid #bcbcbe;
|
||||
height: 20px;
|
||||
width: 10px;
|
||||
border-radius: 1px;
|
||||
background: #d0d0d0;
|
||||
cursor: pointer;
|
||||
margin-top: -6px;
|
||||
}
|
||||
|
||||
.slider:active::-moz-range-thumb {
|
||||
background-color: #4e5b60;
|
||||
border: 1px solid #383739;
|
||||
}
|
||||
|
||||
.slider::-ms-thumb {
|
||||
border: 1px solid #000000;
|
||||
height: 36px;
|
||||
width: 16px;
|
||||
border-radius: 3px;
|
||||
background: #ffffff;
|
||||
-webkit-appearance: none;
|
||||
border: 1px solid #bcbcbe;
|
||||
height: 20px;
|
||||
width: 10px;
|
||||
border-radius: 1px;
|
||||
background: #d0d0d0;
|
||||
cursor: pointer;
|
||||
}*/
|
||||
margin-top: -6px;
|
||||
}
|
||||
|
||||
.slider:active::-ms-thumb {
|
||||
background-color: #4e5b60;
|
||||
border: 1px solid #383739;
|
||||
}
|
||||
|
||||
.slider::-webkit-slider-runnable-track {
|
||||
width: 99%;
|
||||
|
@ -67,39 +81,22 @@
|
|||
.slider:active::-webkit-slider-runnable-track {
|
||||
background: #266d99;
|
||||
}
|
||||
/*
|
||||
|
||||
.slider::-moz-range-track {
|
||||
width: 100%;
|
||||
width: 99%;
|
||||
height: 8.4px;
|
||||
cursor: pointer;
|
||||
background: #3071a9;
|
||||
border-radius: 1.3px;
|
||||
background: #236089;
|
||||
border-radius: 4px;
|
||||
border: 0.2px solid #010101;
|
||||
}
|
||||
|
||||
.slider::-ms-track {
|
||||
width: 100%;
|
||||
width: 99%;
|
||||
height: 8.4px;
|
||||
cursor: pointer;
|
||||
background: transparent;
|
||||
border-color: transparent;
|
||||
border-width: 16px 0;
|
||||
color: transparent;
|
||||
}
|
||||
.slider::-ms-fill-lower {
|
||||
background: #2a6495;
|
||||
background: #236089;
|
||||
border-radius: 4px;
|
||||
border: 0.2px solid #010101;
|
||||
border-radius: 2.6px;
|
||||
}
|
||||
.slider:focus::-ms-fill-lower {
|
||||
background: #3071a9;
|
||||
}
|
||||
.slider::-ms-fill-upper {
|
||||
background: #3071a9;
|
||||
border: 0.2px solid #010101;
|
||||
border-radius: 2.6px;
|
||||
}
|
||||
.slider:focus::-ms-fill-upper {
|
||||
background: #367ebd;
|
||||
}
|
||||
*/
|
||||
|
||||
|
|
Loading…
Reference in New Issue