【问题标题】:z-index not working with overflow to overlap and scrollbarz-index 不能与溢出重叠和滚动条一起使用
【发布时间】:2012-12-11 23:56:35
【问题描述】:

我遇到了以下问题:

我正在尝试显示一些带有内容的<div.content>。大小限制为<div.holder> 作为父级并设置overflow,以便您可以向下滚动以查看所有<div.content><div.content><div.holder> 重叠以进行样式设置。并且所有内容都包含在 <div.container> 中。

<div.content> 不会显示在带有z-index 或其他任何内容的<div.holder> 元素上。它呈现在 <div.holder> 元素内,没有滚动条它呈现在外面,就像我想要的那样。

我怎样才能获得滚动条并且<div.content> 将与其父<div.holder> 重叠?

这是该问题的Fiddle。谢谢。

编辑:

试图做到这一点:

为此样式目的:

这甚至可能吗?我不一定只使用 HTML&CSS,只需要那个东西开始工作。

【问题讨论】:

  • 所以你想让滚动条和内容溢出它的容器?不确定您是否可以获得该功能。 (如果我没看错的话)
  • @ChristopherMarshall 如小提琴所示,我想使用容器上的滚动条和内容与容器重叠
  • 你不能用 css 做到这一点,因为你想做的事情是不一致的。你的用例是什么?或者你为什么要获得这个功能?
  • @ChristopherMarshall 我上传了 2 张图片来描述我的情况。我希望 div.content 看起来像是从后到前。
  • 是的,伪造 .holder 的背景,只需将“功能区”的宽度延长 20 像素即可。和图片一模一样。

标签: html css styles overflow z-index


【解决方案1】:

Z-index 仅适用于有位置的元素。所以它没有对 .foo 做任何事情 http://www.w3schools.com/cssref/pr_pos_z-index.asp

【讨论】:

  • 我在 Fiddle 上忘记了它,但它不适用于 position:relative
猜你喜欢
  • 1970-01-01
  • 2012-07-03
  • 1970-01-01
  • 2019-07-13
  • 1970-01-01
  • 2011-08-10
  • 1970-01-01
  • 2018-07-11
  • 1970-01-01
相关资源
最近更新 更多