-1
<!DOCTYPE html>
<head>
<title>Destiny 2 App</title>
<meta http-equiv="x-ua-compatible" content="ie=edge">
<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">
<style type="text/css">
body {
position: relative;
}
#email {
width: 300px;
}
.jumbotron {
text-align: center;
}
form {
width: 700px;
margin: 0 auto;
display: inline-block;
text-align: center;
}
</style>
</head>
<body>
<nav class="navbar navbar-toggleable-md navbar-light bg-faded">
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="#">Destiny 2 Analyzer</a>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Download</a>
</li>
</ul>
</div>
</nav>
<div class="jumbotron">
<h1 class="display-3">Destiny 2 Analyzer</h1>
<p class="lead">Delivering news and content about the new Bungie API pre-release Destiny 2</p>
<hr class="my-4">
<p>Sign up below to keep up to date on all news as it breaks!</p>
<form class="form-inline"> //This form is what I want to center
<div class="container"></div>
<div class="form-group">
<label class="sr-only" for="email">Email address</label>
<div class="input-group">
<div class="input-group-addon">@</div>
<input type="text" class="form-control" id="email" placeholder="Email">
</div>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
<!-- jQuery first, then Tether, then Bootstrap JS. -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" crossorigin="anonymous"></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 type="text/javascript">
</script>
</body>
「ありがとう！」というラベルのフォームをご覧ください。私はすべての可能な方法を試しましたが、フォーム内の要素は決して中心に来ません！私はどんな助けにも感謝します。私はこのプロジェクトを仕上げようとしており、このシンプルなフォームは私を絶対に狂ってしまう。ブートストラップ4を使用してこのフォームをJumbotronの中央に配置するにはどうすればよいですか？