ionic android绝对定位,Safari中的CSS故障与Ionicons作为背景内容和绝对定位

我创建了我的第一个使用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等一切都很好。

任何提示？谢谢你们

问题是什么，确切(“看起来很奇怪”是一个不好的描述)？问题出现的方式是Sass或FontAwesome。 –

@cimmanon是的，你是对的。但是因为我无法发布任何截图，所以很难形容...... –

对于那些不知道的人，可以在http://ionicons.com/cheatsheet找到inoicons字体家族中任何图标的'content'属性。 .html –

ionic android绝对定位,Safari中的CSS故障与Ionicons作为背景内容和绝对定位相关推荐

css safari 字体模糊,悬停在Safari中的CSS过渡减轻了某些字体的颜色
没有更多的相关主题,我发现我遇到的问题,但这是涉及到上述问题.所以,对某些人可能会有所帮助. 两句话:我有一些容器(弹出),里面有一些元素. 出现的方式如下:容器背景通过不透明度渐渐变暗,内部元素扩大 ...
css3 flex 省略号,CSS：使用flexbox的中间省略号，在safari中的中断
我试图在使用flexbox而不是float的两段内容之间创建一个省略号.我需要的效果可能永远不会与浮动工作.CSS:使用flexbox的中间省略号,在safari中的中断第一个"列&quo ...
CSS flex 盒子在 Chrome 和 Safari 中的行为差异
文章出自个人博客 https://knightyun.github.io/2021/07/05/css-flex-chrome-safari-bug,转载请申明. 问题最近的开发中有遇到一个页面样式 ...
在 Mac 上的 Safari 中下载时遇到问题？故障排除和修复的方法
在 Mac 上的 Safari 中下载时遇到问题?小编将告诉大家解决 Safari 下载丢失.卡住和丢失的方法. 一.检查您的默认下载文件夹 Safari 浏览器会将您下载的每个文件发送到 Mac 上 ...
从Chrome中的css自定义样式按钮中删除蓝色边框
本文翻译自:Remove blue border from css custom-styled button in Chrome I'm working on a web page, and I wa ...
Swift:在Safari中打开App
打开之前会发生什么呢,先看看这个图: 我这里只是简单模拟了一下.当你输入一个特殊的"url"之后,Safari弹出一个提示,问你是否继续打开这个App.如果你这个时候confirm ...
Android 4.4 中 WebView 使用注意事项
自Android 4.4起,Android中的WebView开始基于Chromium( 这大概是因为Android部门负责人从Andy Rubin变成了Chrome部门的主管Sundar Pichai ...
Cordova/Ionic Android 开发环境搭建 - Windows系统
电脑操作系统 - windows 10 IDE - WebStorm 2019 Node v10.15.3 npm v6.4.1 Ionic v3 Angula v5 Cordova 移动设备 - 机 ...
如何隐藏 Safari 中 input 标签的 autofill 图标
Safari 浏览器会为 <input type="passport"> 标签自动添加一个小锁的图标(如下图),本意上是让用户可以从这里选择相应的用户名/密码进行自 ...

ionic android绝对定位,Safari中的CSS故障与Ionicons作为背景内容和绝对定位

ionic android绝对定位,Safari中的CSS故障与Ionicons作为背景内容和绝对定位相关推荐

最新文章

热门文章