css - Button Class 获取不到div的全长？

Question

我试图给出 div 的全长。但是按钮不能得到全长。请帮我解决错误。

<div class="col-md-3 col-sm-6 text-center card">
  <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">  
     <span class="icon">
        <img src="{{ URL::asset('frontAssets/assets/images/classroutine1.png')}}" 
             alt="Classroutine" style="width:50%; 
             height: 93.3px; padding-top: 15px; padding-bottom: 25px">
      </span>
      <div style=" padding-bottom: 10px; padding-top: 20px">
            <h3>Class <br> Routine</h3> 
       </div>
   </button>
</div>

Answer 1

尝试更新 css:

.card {
    padding-right: 0px;
    padding-left: 0px;
}
.block {
    display: block;
    width: 100%;
}

并且按钮已经占据了父级div的全宽，如果你想让div更宽，尝试调整bootstrap列的大小，例如col -md-3 到 col-md-6:

<div class="col-md-6 col-sm-6 text-center card">