Question

我有以下问题：

再次来源：

<div class="folder_browser_panel_item">
  <div class="folder_browser_panel_item_head">

  </div>
  <div class="folder_browser_panel_item_content">
    Foo Foo Foo Foo Foo Foo Foo Foo Foo Foo Foo Foo Foo Foo Foo
  </div>
</div>

.folder_browser_panel_item {
  height: 330px;
  width: 200px;
  overflow-x: scroll;
}

.folder_browser_panel_item_head {
  background: red;
  height: 100px;
}

.folder_browser_panel_item_content {
  background: black;
  width: 400px;
  height: 200px;
  color: white;
}

在这里你可以看到一个包含2个其他div的容器div。容器本身具有设置为滚动的overflow属性。此容器中的第二个div具有更高的宽度，容器使滚动条可见，我可以滚动。如果我滚动，第一个div没有展开，它仍然在容器的宽度上。但我喜欢扩展的第一个div。我喜欢，即使我滚动，也可以看到第一个div的背景颜色......

我知道可以将容器的背景设置为红色，但我想知道是否还有其他方法。

非常感谢你的帮助！

Answer 1

我认为没有CSS方法可以做到这一点。您可以使用Javascript计算它或使用与第二个容器相同的宽度来使其工作。

See this fiddle

.folder_browser_panel_item_head {
  background: red repeat;
  height: 100px;
  width: 400px;
}

当溢出设置为滚动时，使子项扩展为父项的宽度

1 个答案: