Hey, nice solution. everything works fine. Good job.
Only thing is that background-pattern doesn't cover whole width. Looks like you missed it while codding, hope you will fix it - good luck.
Marked as helpful
@promathieuthiry
Posted
@hardy333 thanks for your reply. Which browser do you use? In safari indee, it doesn't cover the whole width but on firefox and chrome it works fine for me.
@promathieuthiry check this image here . Also as you can see slider thumb is not rendered correctly on firefox :(( To fix that you can add .input::-moz-range-thumb{...} this
@promathieuthiry BTW using linear-gradient for slider background was so cleaver.
@promathieuthiry
Posted
@hardy333 thanks. That changes quite a little bit with the others browsers.
@promathieuthiry @promathieuthiry So basically on webkit browsers everything works fine in terms of slider. In terms of pattern-image it doesn't covers hole width on non of the browsers, which is kine of logical.
