Html 提交按钮和输入在Boostrap 4中有不同的宽度

我使用的是bootstrap4，我似乎无法使提交按钮与输入按钮的大小相同。我尝试了不同的组合，但每次按钮都比输入宽。我想这可能是一些我不知道的按钮的引导默认CSS？谢谢大家!

这是我的代码：`

电子邮件地址
我们永远不会与其他人共享您的电子邮件
密码
提交

第一个解决方案

原因是您的输入字段位于类的

col

内，类的列从引导插件中获得

右填充：15px

和

左填充：15px

您可以将类添加到列

padding\u 0

类似的内容

<div class="col-sm-12 col-md-10 col-lg-9 col-xl-8 padding_0">

创建一个类似于下面代码的父div，并将

col-*

类添加到该div。同时将

width:100%

设置到该按钮

<div class="row justify-content-center">
<button type="submit" class="btn btn-success col-sm-12 col-md-10 col-lg-9 col-xl-8" name="submit">Submit</button>
 </div>

<div class="row justify-content-center form-group">
  <div class="col-sm-12 col-md-10 col-lg-9 col-xl-8">
  <button type="submit" name="submit" class="btn btn-success" style="width: 100%;">Submit</button>
     </div>
  </div>

提交

第二个解决方案的代码片段

电子邮件地址
我们永远不会与其他人共享您的电子邮件
密码
提交

谢谢。这两种方法都有效，但为了与我编写代码的方式保持一致，我使用了第二种方法。