代码之家  ›  专栏  ›  技术社区  ›  Joel Glovier

绝对定位元素跳下来:积极-但为什么?

  •  2
  • Joel Glovier  · 技术社区  · 16 年前

    我有一个锚,上面包着一块 <em> 标签,这样我就可以绝对的位置上的锚背景精灵,它坐在左边的锚文本。

    一切都很好,除了在活动:绝对定位位跳下来约20像素。

    我很难诊断这个问题,因为你只能用firebug检查:活动状态,因为你必须点击元素才能显示:活动规则!

    这是那一页 http://cure.org/brant

    仅供参考此页的样式在布兰特.css文件,而不是main.min.css文件

    2 回复  |  直到 16 年前
        1
  •  2
  •   GWB    16 年前

    这个 position 正在设置为 relative 在此规则中:

    a:active {
        outline:0 none;
        position:relative;
        top:1px;
    }
    

    position:static 以重写 a:active 行为:

    li.lp-ask-butn-sm a:hover, li.lp-ask-butn-sm a:focus, li.lp-ask-butn-sm a:active {
        background-position:left -50px;
        color:#2F2511;
        position:static; /* add this */
    }
    
        2
  •  3
  •   Razor Storm    16 年前

    好吧,我找到了,

    你有一个规则可以做到这一点:

    a.active 
    {
        position:relative;
    }
    

    这是给你的活动按钮相对定位。 将静态定位添加到有限合伙人-问但是山猫甲:悬停,有限合伙人-问butn sm a:集中注意力,有限合伙人-问但是sm a:积极参与

    帮助

    li.lp-ask-butn-sm a:hover, li.lp-ask-butn-sm a:focus, li.lp-ask-butn-sm a:active
    {
        position:static;
    }
    

    更新:根据firebug的说法,link和strong仍然在正确的位置,但是它被渲染得更低。这令人费解。

    无论如何,我发布的关于这一段的解决方案解决了这个问题。