[solved] Range + item-stacked-label


It looks like once upon a time this was mentioned in a github issue, but I still see this behavior happening. It looks like item-stacked-label and range classes are incompatible. CodePen example here.

I’d love to be able to have a stacked label with text to the right of the label denotating the value and the slider below, e.g.


You can use something like this:

<label class="item ">
    <div class="item-content">Wave intensity</div>
    <div class="range range-positive">
        <i class="icon ion-minus-circled"></i>
        <input type="range" name="volume" min="10" max="20" value="14"  >
        <i class="icon ion-plus-circled"></i>


Thanks for the workaround - I guess I didn’t even think/realize that you can just change the structure like that. Still, though, we shouldn’t need to manipulate the DOM structure to get it to behave properly.