Multiple ranges on the same line using DoubleRange



  • Hello, I have an interest in using DoubleRange, http://quasar-framework.org/components/double-range.html , but I want to be able to put multiple ranges on the same line. It doesn’t look like there’s any support out of the box. I was wondering if other people have had this issue and what they did to resolve it.


  • Admin

    Of course there is. Use a <div class="row items-center"> <q-double-range....> <q-double-range....> </div>. You can even throw in a sm-column to make it responsive.



  • Hi there … seems now-days even the double-range is not present, as was renamed/split to slider/range (am I right?).
    Anyway, I like this setup, but also missing an option to actually have more ranges within one QRange. e.g. to be able to set intervals/limits like: 0 - 20 - 50 - 80 - 100
    Using multiple QRanges in one div is a way, but loosing the “proportionality” when having e.g. 0 - 100 - 900 - 1000 …
    Thanks for any idea here …


Log in to reply