CSS(webkit):在绝对定位元素上覆盖顶部和底部

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5078021/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 23:46:10  来源:igfitidea点击:

CSS (webkit): overriding top with bottom on absolute-positioned element

csswebkitcss-position

提问by Marcus

I'm having a problem with overriding some plugin CSS. Editing that CSS directly is not really an option, as it would make updating the plugin more risky.

我在覆盖某些插件 CSS 时遇到问题。直接编辑该 CSS 并不是一个真正的选择,因为它会使更新插件的风险更大。

The problem: an element has absolute positioning, and has top:0px in the original. I want to override it by bottom:0px.

问题:元素具有绝对定位,并且在原始元素中具有 top:0px。我想用底部:0px 覆盖它。

For the sake of example

为了举例

    .element {position:absolute; top:0;}

    /* in another file */
    .my .element {bottom:0;}

On firefox this works ok (bottom:0 is the applied style), but safari/chrome don't seem to be get over the top:0.

在 Firefox 上这工作正常(底部:0 是应用的样式),但 safari/chrome 似乎没有超过顶部:0。

I can work around this problem, but it would be nice to come up with a clean solution.

我可以解决这个问题,但是想出一个干净的解决方案会很好。

回答by thirtydot

Use top: autoto "reset" topto its initial value.

使用top: auto“重置”top它的初始值

bottomis a totally separate property to top(an element can have both a topand bottom), so perhaps you won't need bottomanymore.

bottom是一个完全独立的属性top一个元素可以同时有 atopbottom),所以也许你不再需要bottom了。

Also, make sure your override selector is specific enough, but it doesn't sound like that's the problem in this case.

此外,请确保您的覆盖选择器足够具体,但在这种情况下听起来似乎不是问题。

回答by Chris Godwin

.my .element { position: inherit !important; top: auto; }