li元素溢出卡片容器并增加父容器以适应自身。

可以使用CSS的overflow属性来解决li元素溢出卡片容器的问题。通过设置overflow属性为"auto"或者"scroll"，可以实现在容器溢出时自动添加滚动条。另外，可以使用CSS的min-width属性来设置父容器的最小宽度，以适应li元素的宽度。

以下是一个示例代码：

HTML代码：

<div class="card-container">
  <ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
  </ul>
</div>

CSS代码：

.card-container {
  width: 200px; /* 设置卡片容器的固定宽度 */
  min-width: 200px; /* 设置卡片容器的最小宽度，以适应li元素的宽度 */
  height: 200px; /* 设置卡片容器的固定高度 */
  overflow: auto; /* 当li元素溢出时，自动添加滚动条 */
}

ul {
  padding: 0;
  margin: 0;
  list-style: none;
}

li {
  background-color: lightgray;
  padding: 10px;
  margin-bottom: 10px;
}

在上述示例中，card-container类表示卡片容器，设置了固定的宽度和高度。overflow属性设置为auto，当li元素溢出时，会自动添加滚动条。ul元素和li元素的样式用于设置li元素的样式和布局。