链接文字

在Safari / Chrome中,它在ol,blockquotes和其他元素的左侧/顶部有额外的间距。

我无法隔离这一点,但是当我在Safari中查看Web检查器时,它在一些元素上获得了26px的边距。 我没有指定任何这样的规则,这是Web检查器中的错误吗?

有人可以告诉我为什么这些exta间距问题正在发生? 谢谢!

#1楼 票数:14 已采纳

剩余边距:26px是你造型边缘的“计算样式” - 左:2em。 因此,为什么它在Safari的Web Inspector中的Computed Style部分下。 因此,如果您将margin-left更改为其他值,则计算样式的像素值也会更改。

无论如何确实有额外的填充! 它是由用户代理样式表(-webkit-padding-start:40px)引起的。 通过在ol上设置填充:0以及您想要的任何其他元素来重置此样式。

防止这个问题再次发生并且不必担心发展的好方法是重置你的CSS。 基本重置将是:

* { margin:0; padding:0; }

  ask by Chris J Allen translate from so

未解决问题?本站智能推荐:

2回复

Safari和Chrome会忽略min-widthCSS属性

为什么Safari和Chrome会忽略min-width CSS属性? 示例http://jsfiddle.net/8YFHu/2/这适用于IE和Firefox,但不适用于Safari和Chrome。
1回复

如何在Chrome和Safari中重置input[type=“text”]:focus的默认样式?

我已经在此Codepen上创建了搜索功能,并且在Firefox上看起来还不错。 如您所见,状态当前为:focus并且通过添加背景图像来进行input[type="reset"] 。 的HTML 的CSS 但是在Chrome和Safari中,似乎不需要重置输入类型,因为有一个显示的
1回复

可滚动高度忽略了Safari/Chrome中可滚动div的最后一个子级的底部边距

.scroll { border: 1px solid black; width: 200px; height: 200px; overflow: scroll; background-color: yellow; } .inner { height: 100%; } .content {
1回复

相同的CSS,但Chrome和Safari的结果不同

我的网站首页上有一个搜索元素小部件。 小部件内有代表搜索条件的不同选项卡。 问题是这些内部搜索标签在Chrome和Safari中看起来不同。 我将同时附上Chrome和Safari版本的屏幕截图。 Chrome版本(首选版本) Safari版本(希望在Chrome中看起来像它一样
2回复

CSS和Safari/Chrome

我一直在尝试修改以下菜单,使其在IE,Firefox和Safari / Chrome中显得简洁,但我似乎无法在Safari / Chrome中看到它。 谁能告诉我如何解决它? 在Safari或Chrome中查看时,请注意菜单忽略了填充。 查看类似flickr的菜单 提前致谢!
3回复

定位Chrome而不是Safari的SCSS

我正在寻找一种仅在scss中的mixin中定位chrome浏览器的方法 。 目前,这同时针对野生动物园和Chrome。
2回复

将CSS分为Chrome和Safari

有没有办法为Chrome和Safari定义不同的样式集? 通常都有一个针对他们两个的webkit属性,但是我需要将它们分开,这可能吗?
3回复

Safari/Chrome的圆角

因此,我尝试了所有人推荐的所有方法来解决此问题,这就是为什么我寻求帮助。 我遇到了一个圆角问题,它显示的是它在Firefox上的显示方式,而不是Safari或Chrome。 这是我的代码: 我尝试了各种组合,例如使用“ px”而不是“%”,以这种格式获取所有内容:border-radiu