弹性容器占据元素的宽度

要实现弹性容器占据元素的宽度，可以使用CSS中的flexbox布局。以下是一个示例代码：

HTML:

<div class="container">
  <div class="item">Item 1</div>
  <div class="item">Item 2</div>
  <div class="item">Item 3</div>
</div>

CSS:

.container {
  display: flex;
}

.item {
  flex: 1;
  border: 1px solid black;
  padding: 10px;
}

在上述代码中，我们创建了一个包含三个项目的容器，并使用display: flex将其设置为弹性容器。

接下来，我们为每个项目指定了flex: 1属性。这将使每个项目占据相等的宽度，以填充容器的可用空间。

我们还为项目添加了一些样式，例如边框和内边距，以便更清晰地看到它们的宽度。

通过以上代码，弹性容器将会自动调整项目的宽度，使其占据容器的可用空间。