IT 小ネタ
html の input type="range" を css でカッコつけてみた

html の input 要素。
右に左にぐいーんってできます。
これを css でちょっとカッコつけみました。。
-webkit-appearance:none;
width: 100%; background: #eee;
box-shadow: 0 0 10px #666;
border-radius: 50px;
}
input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none;
background: #333;
width: 50px;
height: 50px;
border-radius: 50%;
}
input[type="range"]::-webkit-slider-thumb:hover {
background: #999;
}
input[type="range"]::-webkit-slider-thumb:active {
background: #fefefe;
}