梅反应，我无法正确调整表格宽度

Question

所以我有两个标签，为此我使用了 mui 标签。对于第一个选项卡，我显示成分，在第二个选项卡中，我添加了不同形式的新成分。我对每个表单都有不同的字段，所以每当我点击一个表单打开（我使用 mui 拆分按钮来选择和打开不同的表单），表单以其宽度打开（有时它会以较小的宽度跳到中心，有时会覆盖整个标签）。看起来很糟糕。我想让它像 500px 这样的固定大小，然后一切看起来都很好。但是对于移动使用或不同的小尺寸组件（我想重用 who tabs 组件），500px 看起来不太好。我需要滚动查看整个表格。我尝试了 100% 或 fit-content 不起作用。我的 CSS 现在看起来像这样。

#formContainer {
    width: 500px;
    height:480px;
    margin-top: 20px;
}

@media only screen and (max-width: 800px) {
    #formContainer {
        max-width:fit-content;
        height:fit-content;
    }
  }

我不擅长 CSS，所以也许我缺少一些基本的东西？我试图寻找它，但我什至不知道如何搜索我的问题。你有什么建议？谢谢

Answer 1

要确切地知道你要做什么有点困难。我在我的一个角度项目中所做的是使用具有百分比值的固定位置

#formContainer {
    position: fixed;
    width: 500px;
    height:480px;
    margin-top: 20px;
}

您可能还想将其更改为一个类而不是一个 ID，因为它不仅可以在单个元素中重复使用。

其次，您可以保留当前值，但也可以使用最大值

#formContainer {
    width: 500px;
    max-width: 50%;
    height: 480px;
    min-height: 50%;
    margin-top: 20px;
}

由于某种原因，最小高度似乎与最大宽度相同。 我不是 CSS 专家，所以希望你能得到关于如何和为什么的更准确的答案。我只是一个在 CSS 世界中受苦的旅居者。