2016-03-25 7 views
0

Not centerBootstrap Zentrum Form und etwas Text unter der Form

<div class="row"> 
    <div class="col-md-4"> 

    </div> 
    <div class="col-md-4">  
     <div class="center-block text-center"> 
      <form asp-controller="Account" asp-action="Login" asp-route-returnurl="@ViewData["ReturnUrl"]" method="post" class="form-horizontal" role="form"> 
       <div asp-validation-summary="ValidationSummary.All" class="text-danger"></div> 
       <div class="form-group"> 
        <div class="col-md-10"> 
         <input asp-for="Email" placeholder="Email" class="form-control" /> 
         <span asp-validation-for="Email" class="text-danger"></span> 
        </div> 
       </div> 
       <div class="form-group"> 
        <div class="col-md-10"> 
         <input asp-for="Password" placeholder="Password" class="form-control" /> 
         <span asp-validation-for="Password" class="text-danger"></span> 
        </div> 
       </div> 
       <div class="form-group"> 
        <div class="col-md-10"> 
         <button type="submit" class="btn btn-block">Sign in</button> 
        </div> 
       </div> 
      </form>   
      <p> 
       <a asp-controller="Home" asp-action="Register">Sign up</a> 
      </p> 
      <p> 
       <a asp-action="ForgotPassword">Forgot your password?</a> 
      </p> 
      <p> 
       <a asp-controller="Home" asp-action="Index">Return</a> 
      </p>   
     </div> 
    </div> 
    <div class="col-md-4"> 

    </div> 
</div> 

Antwort

1

Der Text zentriert ist, aber die Form hat eine Breite, 10/12 (83%). Sie sollten die col-md-10 zu col-md-12 ändern.

<div class="form-group"> 
    <div class="col-md-12"> 
     <input asp-for="Email" placeholder="Email" class="form-control" /> 
     <span asp-validation-for="Email" class="text-danger"></span> 
    </div> 
</div> 
<div class="form-group"> 
    <div class="col-md-12"> 
     <input asp-for="Password" placeholder="Password" class="form-control" /> 
     <span asp-validation-for="Password" class="text-danger"></span> 
    </div> 
</div> 
<div class="form-group"> 
    <div class="col-md-12"> 
     <button type="submit" class="btn btn-block">Sign in</button> 
    </div> 
</div> 
+0

Oh! sieht aus, als hätte ich vergessen, diese zu ändern. ja, oder einfach keine Klasse dafür verwenden. –

0

Ich glaube, dass es das Beste sein wird, die col-md-10 Klasse zu entfernen:

<div class="form-group"> 
    <div class=""> 
     <input asp-for="Email" placeholder="Email" class="form-control" /> 
     <span asp-validation-for="Email" class="text-danger"></span> 
    </div> 
</div> 
<div class="form-group"> 
    <div class=""> 
     <input asp-for="Password" placeholder="Password" class="form-control" /> 
     <span asp-validation-for="Password" class="text-danger"></span> 
    </div> 
</div> 
<div class="form-group"> 
    <div class=""> 
     <button type="submit" class="btn btn-block">Sign in</button> 
    </div> 
</div> 
Verwandte Themen