溢出：隐藏不一致工作

我正在使用某些按钮。我想有一个翻转状态，我在一个带有溢出的div的图像中有这个：hidden隐藏不活动的状态。它的工作原理有时，但有时它看起来像这样：溢出：隐藏不一致工作

Broken

最奇怪的是，当我尝试使用Chrome Web检查其自我修复！在HTML/CSS中没有什么奇怪的东西。

Working

我为超级困惑，为什么它不是一贯要么损坏或工作。

这里的HTML：

<div class="hunting_card_button"> 
    <div class="hunting_card_icon" id="gift_to_friend"> 
     <img src="/images/icons/friend2.png?1" /> 
    </div> 
    Friend 
</div>

和相关的CSS：

.hunting_card_button { 
    width: 65px; 
    overflow: hidden; 
    display: inline-block; 
    text-align: center; 
    margin: 0 2px 0 2px; 
} 
.hunting_card_icon { 
    position: relative; 
    right: 0; 
} 
.hunting_card_icon:hover { 
    right: 65px; 
    cursor: pointer; 
}

来源

2012-04-13 Brad Dwyer

你能分享你如何做翻转？它是JS还是CSS？ – bhamlin 2012-04-13 17:48:40

在CSS中编辑它。我们也在做一些JS来处理这些按钮的状态，但这只是在点击时执行，所以它不应该发挥作用，因为这是在页面加载时进行的。 – 2012-04-13 17:51:27

必须有别的事情正在进行。我试图用这个jsFiddle复制你的问题：http://jsfiddle.net/zaTMh/3/ ，但我不能repro ... – bhamlin 2012-04-13 20:23:51

解决的办法是改变其容器之一从跨度股利。

来源

2012-05-17 14:29:02

溢出：隐藏不一致工作

回答

相关问题