z-index始终显示图标

Question

我试图让两个字体真棒图标始终显示在一系列div上。

当用户将鼠标悬停在主要细节上时，我可以将细节包围在具有不同背景的边框中。但是，这确实会阻止图标正确显示。

我知道这需要使用z-index，但我所有正确显示图标的尝试都失败了。我搜索了SO＆amp;谷歌，但仍然无法解决这个简单的问题。

这是我试图实现的目标：

这就是我目前所拥有的：

这是我的JSFiddle示例。

我非常感谢能够帮助解决这个问题。

只是显示jsfiddle的一些代码：

<div id="id_membership_details_resume_template" class="live_preview_wrapper noselect resumeStyleWrapper10" dir="ltr" style="direction: ltr;">

Answer 1

删除此

<?php
header("Location: http://www.example.com/"); /* Redirect browser */

/* Make sure that code below does not get executed when we redirect. */
exit;
?>

编辑：并为X按钮更新此项（根据jsfiddle提供的模板，只更改了顶部和右侧）

#id_resume_detail_content {
    position: relative;
}