将div放在页面内容之上

Question

我已经实现了一个动态显示搜索选项的弹出框.我希望该框能够"浮动"在所有网站内容之上.目前,当显示该框时,它取代了它下面的所有内容并且看起来很糟糕.

我相信我已经尝试将盒子div的z-index设置为高于剩余页面内容的z-index,但仍然没有运气.

Answer 1

你想使用绝对定位.

绝对位置元素相对于具有静态位置的第一父元素定位.如果找不到这样的元素,则包含的块是html

例如 :

.yourDiv{
  position:absolute;
  top: 123px;
}

要使它工作,父母需要是亲戚(position:relative)

在你的情况下,这应该做的伎俩:

.suggestionsBox{position:absolute; top:40px;}
#specific_locations_add{position:relative;}

Answer 2

使用

position: absolute;
top: ...px;
left: ...px;

定位div.确保它没有位置为parent的父标记;相对;

Answer 3

给z-index:-1闪光灯并给予z-index:100div ..