我创建了我的第一个使用SASS(Compass)的网站,我非常喜欢它,它是一个非常方便的工具。我还添加了Font Awesome,并经常使用它,因为我想优化Retina desiplays,因此使用更少的图形。Safari中的CSS故障与Ionicons作为背景内容和绝对定位
我工作的反馈交易和在线讨论,所以我想将一个“+”和项目“ - ”符号作为两个酒吧里面背景:https://www.orat.io/stmt/42
这是代码'+' 符号:
.bar {
height: 3em;
background: lighten($pro-color, 20);
position: relative;
@extend %global-border-radius;
margin-bottom: $margin/2;
&:before {
position:absolute;
top: -14px;
right: 4px;
font-size: 5em;
color: #f8f8f8;
content: "\f1c9";
font-family: ionicons;
}
.inner {
position: absolute;
background: $pro-color;
text-align: right;
color: #fff;
font: 300 2.25em $font-primary;
padding: 0 10px;
left: 0;
top: 0;
bottom: 0;
min-width: 8%;
@extend %global-border-radius;
}
}
的问题是,在野生(特别是在iOS)的图标奇怪地定位。我试图改变各种参数,但没有奏效。 Chrome,Firefox等一切都很好。
任何提示? 谢谢你们
+0
问题是什么,确切(“看起来很奇怪”是一个不好的描述)?问题出现的方式是Sass或FontAwesome。 –
+0
@cimmanon是的,你是对的。但是因为我无法发布任何截图,所以很难形容...... –
+0
对于那些不知道的人,可以在http://ionicons.com/cheatsheet找到inoicons字体家族中任何图标的'content'属性。 .html –