Html 调整子高度不拉伸到父高度（使用“对齐自拉伸”）

.appShopSummaryContainer{
显示器：flex；
柔性流：柱包裹；
}
.appShopSummaryContainer.appShopSummaryProductWrap{
弹性基准：100%；
背景：粉红色；
身高：100%；
宽度：100%；
显示器：flex；
flex-flow：行nowrap；
对齐项目：居中；
}
.appShopSummaryContainer.appShopSummaryImg{
弹性：0.40%；
高度：自动；
垫底：26.667%；
背景：绿色；
背景尺寸：封面！重要；
背景位置：中-中！重要；
}
.appShopSummaryContainer.appShopSummaryInfo{
弹性：0.60%；
背景：橙色；
显示器：flex；
柔性流：柱包裹；
调整项目：灵活启动；
高度：100%；/*不工作*/
/*不起作用：对齐自身：拉伸*/
}
.appShopSummaryContainer.appShopSummaryMoreInfoBtn{
光标：指针；
背景：214291；
颜色：#fff；
填充：10px；
边界半径：5px；
}

标题

你是说这样的事吗？
您必须添加

对齐项目：拉伸发送给父项，而不是项目本身

看看这个

添加
对齐项目：拉伸到
.appShopSummaryContainer.appShopSummaryProductWrap
并移除
高度：100%来自
.appshopsumaryContainer.appshopsumaryInfo
并添加
调整内容：中心至
.appShopSummaryContainer.appShopSummaryInfo


.appShopSummaryContainer{
显示器：flex；
柔性流：柱包裹；
}
.appShopSummaryContainer.appShopSummaryProductWrap{
弹性基准：100%；
背景：粉红色；
身高：100%；
宽度：100%；
显示器：flex；
flex-flow：行nowrap；
对齐项目：拉伸；
}
.appShopSummaryContainer.appShopSummaryImg{
弹性：0.40%；
高度：自动；
垫底：26.667%；
背景：绿色；
背景尺寸：封面！重要；
背景位置：中-中！重要；
}
.appShopSummaryContainer.appShopSummaryInfo{
弹性：0.60%；
背景：橙色；
显示器：flex；
柔性流：柱包裹；
调整项目：灵活启动；
证明内容：中心；
}
.appShopSummaryContainer.appShopSummaryMoreInfoBtn{
光标：指针；
背景：214291；
颜色：#fff；
填充：10px；
边界半径：5px；
}

标题
看起来它可以将其显示为网格，但仍然想知道为什么flex不起作用（网格解决方案：）