html - Making input range slider take all available space -
https://jsfiddle.net/a5gdhmfn/1/
<div> <i>o</i> <input type="range" /> <button/> <div>...</div> </div>
i have range slider inside div contains other assorted elements. other elements inside div fixed-width.
currently range slider set percentage width scales leaves increasingly large margin resolution of page increases; range slider should take available space left in div while leaving other elements are.
i'd know if there pure css/html way of achieving goal.
you can add display flex each element in play bar. use
flex-grow:1;
on slider bar.
works in firefox.
https://jsfiddle.net/a5gdhmfn/2/
problem flex is supported in modern browsers. , have use vendor prefixes work across board.
-webkit-flex: 1; /* safari 6.1+ */
-ms-flex: 1; /* ie 10 */
Comments
Post a Comment