html - bootstrap 3 jumbotron under bs-header -
i'm updating site bootstrap 3 , have problem have added navbar , header when try add jumbotron appears under bs-header dono why check every thing if div closed , sow if 1 can tel me i'm doing wrong ?
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content=""> <meta name="author" content="hypergainz"> <title> mod pack · mmp </title> <!-- bootstrap core css --> <link href="assets/css/bootstrap-simplex.css" rel="stylesheet"> <link href="assets/css/bootstrap-simplex.min.css" rel="stylesheet"> <!-- documentation extras --> <link href="assets/css/docs-index.css" rel="stylesheet"> <link href="assets/css/pygments-manni.css" rel="stylesheet"> <!-- html5 shim , respond.js ie8 support of html5 elements , media queries --> <!--[if lt ie 9]> <script src="../../assets/js/html5shiv.js"></script> <script src="../../assets/js/respond.min.js"></script> <![endif]--> <!-- favicons --> <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../assets/ico/apple-touch-icon-144.png"> <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114.png"> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72.png"> <link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57.png"> <link rel="shortcut icon" href="../assets/ico/favicon.png"> </head> <body> <div class="navbar navbar-default navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <a href="../" class="navbar-brand">mmp</a> <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-main"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <div class="navbar-collapse collapse" id="navbar-main"> <ul class="nav navbar-nav"> <li class="active"> <a href="/">home</a> </li> <li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" href="#" id="download">dropdown <span class="caret"></span></a> <ul class="dropdown-menu" aria-labelledby="download"> <li><a tabindex="-1" href="#">1</a></li> <li><a tabindex="-1" href="#">2</a></li> <li class="divider"></li> <li><a tabindex="-1" href="#">3</a></li> <li><a tabindex="-1" href="#">4</a></li> </ul> </li> </ul> <ul class="nav navbar-nav navbar-right"> <li><a href="#">sign up</a></li> <li class="divider"></li> <li><a href="#">sign in</a></li> </ul> </div> </div> <div class="bs-header" id="content"> <div class="container"> <br /> <img src="assets/img/index.jpeg" class="img-circle" width="125px" height="125px"alt="sevadus" align="left"> <h1>mmp</h1> <p class="lead">my mod pack</p></img> <div id="carbonads-container"> <div class="carbonad"> <div id="azcarbon"> <h4>site version : <span class="badge badge-success">alpha</span></h4> <h4>head of project : <span class="badge badge-info">hypergainz</span></h4> <h4>acepting beta's : <span class="badge badge-success">yes</span></h4> <h4>public launcher : <span class="badge badge-primary">not yet</span></h4> </div> </div> </div> </div> </div> </div> <div class="container"> <div class="row"> <div class="col-lg-12 jumbotron"> <h1>pack assembler</h1> <p>managing mods, packs, , servers , efficiently.</p> <p> <a href="#" class="btn btn-primary btn-large">get started <i class="icon-double-angle-right"></i></a> </p> </div> </div> </div> <!-- placed @ end of document pages load faster --> <script src="assets/js/jquery.js"></script> <script src="assets/js/bootstrap.min.js"></script> </body>
because you're containing .bs-header
within .navbar-fixed-top
you'll need use top padding equal static height of navbar, on body
.
from bootstrap documentation:
the fixed navbar overlay other content, unless add padding top of . tip: default, navbar 50px high.
Comments
Post a Comment