CSS 容器内联大小和固定子级

Question

这是我的项目的一个粗略模型。父级有容器查询，而子级支持修复（偶尔）。如果父级具有内联大小的容器查询，则子级不再固定到页面。

这种行为可以预防吗？我意识到，如果我将内联大小应用于子级而不是父级，它似乎可以工作，但我正在尝试找到一种解决方案，以便在可能的情况下在父级上使用内联大小。

.parent {
  position: relative;
  height: 150px;
  background: #eee;
  max-width: 300px;
  container: dialog_data / inline-size;
}

.child {
  background: red;
  height: 100px;
  top: auto!important;
  position: fixed!important;
  z-index: 2147483648;
  bottom: 20px!important;
  left: 20px!important;
  margin: 0!important;
  width: 100%;
  box-shadow: 0 0 10px rgb(0 0 0 / 50%);
}

<div class="parent">
  <div class="child "></div>
</div>

Answer 1

与许多其他属性 container一样，固定元素无法转义其中之一：

布局包含框建立了绝对定位包含块和固定定位包含块。

相关：为什么在父级上应用 CSS 过滤器会破坏子级定位？