Reputation: 3023
I've generated a new asp.net mvc project based on the new Bootstrap 3 template. This does not seem to work properly, as it does not add any spacing between the header navbar and the content rendered below by Renderbody()
. I've tried pasting in examples from the Bootstrap website and use the css provided by Visual Studio when creating the new page, but with no luck.
I've attached the following image to describe (Note no spacing between jumbotron and header):
Here's the markup generated:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - My ASP.NET Application</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li>@Html.ActionLink("Logout", "Index", "Home")</li>
</ul>
<p class="navbar-text navbar-right">
Logged in as @(User.Identity.Name)
</p>
</div>
</div>
</div>
<div class="container body-content">
@RenderBody()
<hr />
<footer>
<p>© @DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)
</body>
</html>
Any help would be greatly appreciated here.
Upvotes: 1
Views: 1302
Reputation: 46
This is not controlled by bootstrap, but by the Site.css file
body {
padding-top: 50px;
padding-bottom: 20px;
}
by changing the padding-top value to e.g. 75 or 100, you get a gap between the nav bar and the content
Upvotes: 1