如何使这个div始终固定在网页上所有元素的顶部?

时间:2016-09-06 18:22:49

标签: html css

enter image description here

在我的博客上获取此输出。 (语言是孟加拉语) 我希望它总是浮在所有元素的前面。但有些内容覆盖了它。怎么解决? 博客:http://www.blogger-tawsif.ga/

代码是,

<div class="grplusbd_floating_likebox">
                    <span class="iconContainer">
                        <img class="ico" src="http://lh3.googleusercontent.com/-jpijNi_XBh4/AAAAAAAAAAI/AAAAAAAAB_0/P3R_olWI_KI/s512-c/photo.jpg"/>         
                    </span>
<iframe id="floatfollow" allowtransparency="true" frameborder="0" height="50" scrolling="no" src="https://www.facebook.com/plugins/follow.php?href=https%3A%2F%2Fwww.facebook.com%2Ftawsif.torabi&amp;width=64&amp;height=65&amp;layout=box_count&amp;size=small&amp;show_faces=true&amp;appId=164293520647951" style="border:none;overflow:hidden; vertical-align: middle; float: right;" width="64"></iframe>
</br>
<span style="font-weight: bold; color: white;">
Tawsif Torabi
</span>
</br>
<small style="font-weight: bold; color: white;">
Web Developer, GR+ Bangladesh
</small>
</div>
<style>
.grplusbd_floating_likebox {
    position: fixed;
    top: 500px;
    left: 0px;
    border-radius: 0px 10px 10px 0px;
    padding: 10px 15px;
    background-color: rgba(255, 0, 0, 0.93);
    box-shadow: 1px 1px 7px black;
}
.iconContainer {
    border-radius: 50px;
    display: inline-block;
    overflow: hidden;
    vertical-align: middle;
}
img.ico{
    vertical-align:middle;
    height: 45px;
    width: auto;
}

</style>

1 个答案:

答案 0 :(得分:2)

你的意思是在前面吗?如果是这样,请添加:

z-index: 9999;

如果顶部是的,有人已经回答了topleft职位