我的代碼有什麼問題？

Question

<div class="row"> 
<div class="container"> 
    <div class="col-md-4 col-md-offset-4"> 
    <div class="login-wrapper"> 
     <div class="login-head"> 
      <h3 class="text-center"> Log in </h3> 
     </div> 

     <form> 
      <div class="form-group"> 
      <label for="email" class="sr-only"> Email </label> 
      <input type="text" placeholder="email here" class="form-control"> 
      </div> 

      <div class="form-group"> 
      <label for="email" class="sr-only"> Password </label> 
      <input type="text" placeholder="Password here" class="form-control"> 
      </div> 

      <button type="button" class="btn btn-danger center-block"> Login </button> 

     </form> 

    </div> 
    </div> 
</div> 
</div> 

此代碼後，我得到的滾動條在我的瀏覽器，所以我檢查後發現，如果我做出改變

.row { margin-right: 0;} 

它就好了。這與我的CSS無關，我刪除了我的CSS並嘗試。所以我應該通過bootstrap改變.row的值嗎？默認值是

.row{margin-right: -15px;} 

編輯：代碼的格式如下的代碼現在

Answer 1

如引導文件中提到，container應該是一個頂級的包裝類，它應該包含row類。你已經交換了這些類。我認爲這是問題的原因。自舉引進

第一規則說：

行必須被放置爲適當對準和填充一個.container（固定寬度）或.container流體（全寬度）之內。

代碼應該是：

<div class="container"> 
<div class="row"> 
    <div class="col-md-4 col-md-offset-4"> 
    <div class="login-wrapper"> 
     <div class="login-head"> 
      <h3 class="text-center"> Log in </h3> 
     </div> 

     <form> 
      <div class="form-group"> 
      <label for="email" class="sr-only"> Email </label> 
      <input type="text" placeholder="email here" class="form-control"> 
      </div> 

      <div class="form-group"> 
      <label for="email" class="sr-only"> Password </label> 
      <input type="text" placeholder="Password here" class="form-control"> 
      </div> 

      <button type="button" class="btn btn-danger center-block"> Login </button> 

     </form> 

    </div> 
    </div> 
</div> 
</div>