无法更改按钮大小

Question

即使我使用CSS类来更改宽度，我也无法更改按钮大小。具有按钮和内容的表单放在<div>row类中。这样他们就会并排出现。

这是我的代码的一部分：

.row.someDiv{
  margin-left: 0px;
  margin-right: 0px;
  max-width: initial;
}
input[type="text"]{
  border: none;
  border-bottom: 1px solid;
  width: 250px;
  margin-bottom: 10px;
  background: transparent;
}
.button-size{
  width: 100px;
  padding-bottom: 20px;
  
}

<div class="row someDiv">
  <div class="col-xs-8">
   <br/>  
   <label>
     <input type="text" class="text-line" placeholder="Name" required></label><br/>
   <label><input type="text" class="text-line"  placeholder="Email Address" required></label><br/>
   <label><input type="text" class="text-line"  placeholder="phone number"></label><br/>
     <label><input id="message-size"  type="text" placeholder="Message"></label><br/>
    <button type="submit" class="button-size space btn btn-block btn-primary"><i class="fa fa-paper-plane">Submit</i></button>
 </div>
 <div class="col-xs-4">
   <p class="content-style"> Want to get in touch? please fill up the form and I'll revert back soon.
  </div>
</div>

Answer 1

看起来你正在使用bootstrap，在这种情况下你的按钮上的btn-block类使按钮成为“块级元素”（相当于给它css {display: block;}）块级元素填充100％的水平空间并推送任何页面下方的其他元素以腾出空间。

Answer 2

语法问题x到px

.button-size{
  width: 100px;
  padding-bottom: 20px;

}

Answer 3

我想到了。该按钮必须包含在<label>元素中。我现在正在使用它。即使我不明白为什么没有<label>按钮可以缩小。它以前对我有用。请随意提出答案。