Wie Formelement Zentrum

-1

please see this picture!Wie Formelement Zentrum

Ich versuche ausrichten ‚Formularelement‘ zur Mitte auszurichten.

hier ist, was ich ausprobiert habe.

1.I verwendet .form-inline {margin: 0 auto;} 2. hinzugefügt Text-Zentrum in Form class = "form-inline"

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous"> 
</head> 
<body> 
<div class="jumbotron"> 
<form class="form-inline"> 
<label class="sr-only" for="email">Email address</label> 
<div class="input-group"> 
<div class="input-group-addon">@</div> 
<input type="email" class="form-control" id="email" placeholder="Your email"> </div> 
<button type="submit" class="btn btn-primary">Sign up</button> 
</form> 
</div> 
</body> 
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script> 
<script src="library/tether-master/dist/js/tether.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script> 
<script> 
< /html>

Könnten Sie mir bitte helfen, eine Lösung zu finden-out?

Quelle

2017-02-22 JillAndMe

Versuchen Sie, die folgenden CSS:

.form-inline { 
    margin: 0 auto; 
    display: table; 
}

Quelle

2017-02-22 07:25:53

Du hast mich gerettet !! Vielen Dank – JillAndMe

Bitte markieren Sie diese Antwort, da dies auch anderen helfen würde –

wenn Ihr Twitter-Bootstrap verwenden, warum Sie mit Bootstrap-Elemente nicht zentriert ????? Saldierung Spalten

.com/css/# raster Verrechnung

hier ist die Bootstrap-Lösung und seine responsiv!

<html lang="en"> 
 
    <head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
    </head> 
 
<body> 
 
    <div class="container jumbotron"> 
 
    <div class="row "> 
 
     <div class="col-sm-8 col-sm-offset-4 column"> 
 
     <form class="form-inline"> 
 
      <label class="sr-only" for="email">Email address</label> 
 
      <div class="input-group"> 
 
       <div class="input-group-addon">@</div> 
 
       <input type="email" class="form-control" id="email" placeholder="Your email"> </div> 
 
       <button type="submit" class="btn btn-primary">Sign up</button> 
 
     </form> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</body> 
 
</html>

Quelle

2017-02-22 07:39:14 MKAD

Wie Formelement Zentrum

Antwort

Verwandte Themen