父`grid` 不考虑孩子的`min-content` 宽度

问题描述

在 Chrome 和 Safari 中，带有 display: grid 样式的父级在计算其自身宽度或其子级位置时似乎没有考虑到其子级是 width: min-content 的事实。自己看看：

#parent {
  position: absolute;
  background: lightgreen;
  display: grid;
  
  justify-content: flex-end;
}

#child {
  padding: 25px;
  Box-shadow: inset 0 0 0 3px red;
  
  width: min-content;
}

<div id="parent">
  <div id="child">
    <p>hello jello allegro rhino cello
  </div>
</div>

我天真地期望的行为是：

• 使红色框（子）向右对齐（因为 justify-content: flex-end）
• 让绿框（父）占据红框的宽度（因为它根本没有理由这么宽，除非它不是最小内容，它正是孩子的宽度）立>

问题： 这是预期的行为吗？规范对此有任何说明吗？或者这是一个错误而 Firefox 做对了吗？

---

我的假设是计算网格布局不是 O(1) 甚至 O(n)，浏览器需要在边缘情况下尽早退出，而 width: min-content 可能是同一回事。但我只是在这里猜测。

---

如果你能指出我在 3 个大浏览器中的任何一个中为这个“错误”打开票的方向，就可以获得奖励积分！

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）