小编Dou*_*lin的帖子

我喜欢使用具有像素回退的rem单位来进行CSS大小调整,并且我正在尝试使用mixins来帮助它.对于font-size,这很容易:

@mixin font-size($size) {
  font-size: $size + px;
  font-size: ($size / 10) + rem;
}

但是对于填充,边距等,mixin需要接受变量参数,这可以根据Sass文档http://sass-lang.com/documentation/file.SASS_REFERENCE.html#variable_arguments来实现.

但是,使用以下mixin,而不是除以10,mixin只是在数字之间添加斜杠.就是这样:

@mixin padding($padding...) {
    padding: $padding + px;
    padding: ($padding / 10) + rem;
}
.class {
    @include padding(24);
}

输出:

.class {
    padding: 24px;
    padding: 24/10rem;
}

而不是像我期望的那样:

.class {
    padding: 24px;
    padding: 2.4rem;
}

有没有办法确保Sass将变量识别为数字,从而正确地使用除法运算符？

此外,经过更多测试后,我意识到连接只发生在最后一个变量上.

对于Firefox的IMG标签中使用的SVG，我有些疑惑。

先使用Codepen：

1. http://codepen.io/doughamlin/pen/Fgosn
2. http://codepen.io/doughamlin/pen/zmBda

Codepen 1使用SVG，在Firefox（版本26）中不起作用。Codepen 2使用JPG并在Firefox中正常工作。两者之间没有其他区别。它们都可以在Chrome，Safari和IE 10中正常工作。

Firefox中的检查器显示SVG的高度和宽度为0。如果我从包含IMG标签的H1移除float：left，则SVG可以正常显示，但是我没有找到其他方法来使SVG显示器无法显示，因为我无法弄清楚为什么图像首先要具有0维。

这只是一些晦涩的Firefox错误，还是我实际上在做错什么？