Html 设置div中心并使其固定

如何在屏幕/父div的中心设置一个div，并使其固定，在将其放置在中心后，它将忽略宽度的变化？我有一个包含一个表的div，它看起来像这样： 我不确定是否需要外部div。我希望我的桌子放在中间，并固定，它将忽略其宽度的变化。以下是我得到的结果： 正如你所看到的，当桌子的大小改变时，它会向左移动，以保持桌子在中间，我想防止这种情况发生，你知道吗？ 这就是我到目前为止所做的：

.main
{
    position: relative;
    width: 600px;
    left: calc(50% - 300px);
    border: 1px solid #000;
}
.table
{
    margin: 0 auto;
}

<div class="main">
  <table class="table">
    <tr><td>Username: </td><td><input type="text"></td><td>ErrorMessage</td></tr>
    <tr><td>Password: </td><td><input type="text"></td><td>ErrorMessage</td></tr>
  </table>
</div>

.main
{
位置：相对位置；
宽度：600px；
左：计算（50%-300px）；
边框：1px实心#000；
}
桌子
{
保证金：0自动；
}
用户名：ErrorMessage
密码：ErrorMessage

尝试在

div中使用此样式，它适合我，您可以在表中使用帮助文本而不是它们

<div style="text-align:center">
    <input/><br/><input/><br/><button/>
</div>





删除
页边距：0自动来自.table
把这条线
`.桌子{
位置：相对位置；
左：45%

}`将您的位置更改为固定位置

position:fixed;

并重新对齐可能已按左上下右重新排列的其他div
为什么使用表格进行布局？表应该用于数据输出或HTML邮件（如果我错了，请纠正我，但这是我所知道的）

您还可以使用此代码将特定元素垂直和水平居中（请记住这是绝对的，但请随意使用）：

关于您希望错误消息不会影响窗体宽度的事实。我建议使用绝对位置

我给你写了一个例子
希望这能有所帮助。
尽管屏幕截图有助于向我们展示问题所在，但如果没有您的标记和样式，我们的手会被束缚住。你能在问题中加入MCVE吗？也。。。根据您对问题的描述判断，在错误消息上使用绝对定位将修复布局问题。而且你不应该真的使用表格来布局，你知道。你可以在你的父元素中尝试文本对齐：居中
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);