Html 在不更改表单大小的情况下向表单输入添加填充

我试图在不更改表单大小的情况下编辑表单文本填充（以匹配占位符）。每次我更改填充时，它都会增加窗体的长度

。表单包装器{
显示器：flex；
证明内容：中心；
弯曲方向：立柱；
边缘：1米6公分；
}
形式{
宽度：100%；
利润率：1米0；
}
.电子邮件输入{
边框左上半径：10px；
边框右上角半径：10px；
边框底部：无；
}
.密码输入{
边框左下半径：10px；
边框右下半径：10px；
}
输入{
宽度：100%；
高度：50px；
边框：实心1px#ccc；
字号：18px；
}
输入：：占位符{
颜色：#ccc；
字号：18px；
左侧填充：25px；
}

您可能需要使用

这将包括元素宽度的边框和填充

* { 
  box-sizing: border-box;
}

小心使用

*

您还可以添加

框大小：边框框仅用于所需的元素。
您可能需要使用

这将包括元素宽度的边框和填充

* { 
  box-sizing: border-box;
}

小心使用
*
您还可以添加
框大小：边框框只添加所需的元素。
添加*{box size:border box；}对于全局css，它不会增加
添加*{box size:border box；}之外的填充。对于全局css，它不会增加
框大小：border box
可能是从
宽度
中减去填充，如下所示：


。表单包装器{
显示器：flex；
证明内容：中心；
弯曲方向：立柱；
边缘：1米6公分；
}
形式{
宽度：100%；
利润率：1米0；
}
.电子邮件输入{
边框左上半径：10px；
边框右上角半径：10px；
边框底部：无；
}
.密码输入{
边框左下半径：10px；
边框右下半径：10px；
}
输入{
宽度：计算（100%-25px）；
高度：50px；
边框：实心1px#ccc；
字号：18px；
左侧填充：25px；
}
输入：：占位符{
颜色：#ccc；
字号：18px；
左侧填充：25px；
}
框尺寸的另一种选择：边框框

可能是从

宽度

中减去填充，如下所示：

。表单包装器{
显示器：flex；
证明内容：中心；
弯曲方向：立柱；
边缘：1米6公分；
}
形式{
宽度：100%；
利润率：1米0；
}
.电子邮件输入{
边框左上半径：10px；
边框右上角半径：10px；
边框底部：无；
}
.密码输入{
边框左下半径：10px；
边框右下半径：10px；
}
输入{
宽度：计算（100%-25px）；
高度：50px；
边框：实心1px#ccc；
字号：18px；
左侧填充：25px；
}
输入：：占位符{
颜色：#ccc；
字号：18px；
左侧填充：25px；
}

您可以添加

框大小：边框框

可以添加

框大小：边框框在什么之外？你忘了写剩下的答案了吗？在什么之外？你忘了写剩下的答案了吗？