z-index似乎在较小的尺寸下不能正常工作

时间:2013-09-12 07:25:21

标签: image width

我正在制作的网站上有一些相当复杂的堆叠安排。 div上的背景图像是一个渐变,用较低的zindex覆盖其中的图像。像这样:

enter image description here

因此,这在较大的宽度下工作正常。当宽度较小时,图像会出现在渐变背景上,如下所示:

enter image description here

正在发生的事情,我无法弄清楚是什么。我使用twitter Bootstrap 2.3.0作为框架。链接:http://www.osullivans-pubs.com/draft

编辑:我很确定问题与图像上的负z-index有关(#back img)。但是将z-index置于零意味着图像出现在渐变之上......

更新:我解决了这个问题。具有背景图像的元素与子元素重叠是不可能的。所以我在容器之前(并从中分离)创建了一个绝对定位的元素,并将适当的zindex应用于该元素。修好了。

1 个答案:

答案 0 :(得分:0)

你必须在liquid-slider.css文件中添加一个z-index,下面是代码...

.liquid-slider-wrapper {
   margin: 0 auto;
   clear: both;
   overflow: auto;
   position: relative;
   width: 1110px !important;
   z-index: 20;
}