Question

我有一个父母，有一个flex的孩子：

.card {
  background-color: white;
  max-width: 80vw;
  height: auto;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  position: fixed;
  bottom: 10;
  overflow: hidden;
  border-radius: 32.5vw;
  z-index: 100001;
}

.menusC {
  width: auto;
  height: auto;
  margin: auto;
  display: inline-flex;
  flex-wrap: nowrap;
  flex-direction: row;
  align-content: flex-start;
  justify-content: center;
  background-color: red;
}

<div class="card">
  <div class="menusC">
    <div class="menuBC">
      ......
    </div>
  </div>
</div>

如您所见，我的flex是inline-flex，这意味着flex获得了其项目的大小。但是父级card坚持拥有自己的宽度（否则取最大值，否则为100％）。 我如何使card-恰好位于柔韧性的宽度-menusC？

Answer 1

我还没有看到执行代码时的样子，但是为什么父母在left和right设置为0的情况下获得固定位置？

这告诉它从左到右一直走。

也许需要将position: fixed更改为其他内容，或者如果需要固定位置，请删除left或right属性。

弯曲孩子确定父母的宽度

1 个答案: