徘徊时出现一个div在另一个里面 - z-index不起作用

这是我的jsfiddle http://jsfiddle.net/6XdcY/4/。
我有DIV在悬停另一个DIV时出现。徘徊时出现一个div在另一个里面 - z-index不起作用

在包含div中有显示：块和100％的宽度和高度。
这个<A>干扰悬停时应该出现的div。

<div id='language'> 
    <a class='language' href='en'></a> 
    <a class='delete' href='' ></a> 
</div>

#language { 
    width: 172px; 
    height: 218px; 
    opacity: 0.85; 
    margin: 2px; 
    z-index: 1; 
    float: left; 
} 


#language a.language { 
    width: 100%; 
    height: 100%; 
    display: block; 
    z-index: 2; 
} 


#language:hover { 
    width: 172px; 
    height: 218px; 
    opacity: 1; 
    cursor: pointer; 
} 


#language:hover .delete{ 
    display: block; 
} 


.delete { 
    display: none; 
    width: 30px; 
    height: 30px; 
    background: #fff url(http://tyche.ge/palabra/images/delete_language.png); 
    border-top-right-radius: 5px; 
    border-bottom-left-radius: 5px; 
    border-left: 1px solid #88bde4; 
    border-bottom: 1px solid #88bde4; 
    margin-right: 1px; 
    margin-top: 1px; 
    top: 1; 
    right: 1; 
    float: right; 
    z-index: 999; 
}

删除按钮应内含div内部。
用jsfiddle你会更好理解。
在此先感谢

来源

2014-07-23 Joni Bolkvadze

我试图添加POSITION，但失败了.. –

对于初学者来说，不允许多个同名的ID。使用[class instead]标识它们（http://jsfiddle.net/6XdcY/5/） – MLeFevre

具有相同名称的多个ID？ :) –

尝试增加这删除按钮：

position: relative; 
top: -30px;

Live Demo

来源

2014-07-23 15:46:04

http://jsfiddle.net/6XdcY/6/好的建议，谢谢 –

而不是黑客入侵负值。最好在父元素上使用'position：relative'，然后在子节点http://jsfiddle.net/6XdcY/7/上使用'position：absolute'。 – MLeFevre

你可以试试这个：

#language a.language { 
    display: block; 
    height: 83%; // reduce the height from 100% 
    width: 100%; 
    z-index: 2; 
}

或者

中添加两个属性。删除类，就像th是：

.delete 
{ 
    // other properties 
    position: relative; 
    top: -35px; 
}

来源

2014-07-23 15:52:50 AmanVirdi

徘徊时出现一个div在另一个里面 - z-index不起作用

回答

相关问题