将LESS与特定于供应商的伪选择器一起使用

Question

我从here了解到，我无法将包含“伪浏览器选择器”（-moz-range-track，-webkit-slider-thumb等）的CSS选择器放在逗号之间，因为如果浏览器无法识别其中一个选择器，则会忽略大括号{}中的所有规则。

所以当我尝试编译我的LESS规则时：

input {
&[type=range]{
    &::-moz-range-track,
    &::-webkit-slider-runnable-track
    {
      width:100%;
      height: 32px;
    }
  }
}

在结果中我会看到：

input[type=range]::-moz-range-track,
input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 32px;
}

由于我之前提到的原因，这将无效。

所以在LESS中我必须这样做（当然不是LESS风格）：

input {
&[type=range]{
    &::-moz-range-track
    {
      width:100%;
      height: 32px;
    }
    &::-webkit-slider-runnable-track
    {
      width:100%;
      height: 32px;
    }
  }
}

编译为：

input[type=range]::-moz-range-track {
  width: 100%;
  height: 32px;
}
input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 32px;
}

按预期工作。

我的问题是，有没有可能在LESS看起来很好看？