diff --git a/docs/examples/album/index.html b/docs/examples/album/index.html index 11d99c259213696a4bc064b0044d6ea22cccdffa..075d15345aa8c70219697a88a41b59c3e373020a 100644 --- a/docs/examples/album/index.html +++ b/docs/examples/album/index.html @@ -4,6 +4,7 @@ <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> + <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> <meta name="description" content=""> <meta name="author" content=""> <link rel="icon" href="../../favicon.ico"> @@ -35,7 +36,7 @@ </div> </div> </div> - <div class="navbar navbar-static-top navbar-dark bg-inverse"> + <div class="navbar navbar-full navbar-static-top navbar-dark bg-inverse"> <div class="container-fluid"> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar-header" aria-controls="navbar-header" aria-expanded="false" aria-label="Toggle navigation"></button> <a href="#" class="navbar-brand">Album</a> diff --git a/docs/examples/carousel/carousel.css b/docs/examples/carousel/carousel.css index 52c93a2966d52aa7159824f6661a7a1c00f9b7c9..a1ec54fa54964de21add7d6b93bc8bc03a59581b 100644 --- a/docs/examples/carousel/carousel.css +++ b/docs/examples/carousel/carousel.css @@ -3,6 +3,7 @@ /* Padding below the footer and lighter body text */ body { + padding-top: 3rem; padding-bottom: 3rem; color: #5a5a5a; } diff --git a/docs/examples/carousel/index.html b/docs/examples/carousel/index.html index 5503b0eab836c4fcde89f99b7d38bc4f79328b0d..25dc35af27166f2a8d22c5bfc69046d688da47bb 100644 --- a/docs/examples/carousel/index.html +++ b/docs/examples/carousel/index.html @@ -19,7 +19,7 @@ </head> <body> - <nav class="navbar navbar-static-top navbar-light bg-faded"> + <nav class="navbar navbar-fixed-top navbar-dark bg-inverse"> <a href="#" class="navbar-brand">Carousel</a> <ul class="nav navbar-nav"> <li class="nav-item active"> diff --git a/docs/examples/grid/index.html b/docs/examples/grid/index.html index 02df70804b395edbde288986ccea31c601ce1d9e..9b8e23f072098a5caa9fda1f65640c07554622ed 100644 --- a/docs/examples/grid/index.html +++ b/docs/examples/grid/index.html @@ -27,35 +27,35 @@ <h3>Five grid tiers</h3> <p>There are five tiers to the Bootstrap grid system, one for each range of devices we support. Each tier starts at a minimum viewport size and automatically applies to the larger devices unless overridden.</p> -<div class="row"> - <div class="col-xs-4">.col-xs-4</div> - <div class="col-xs-4">.col-xs-4</div> - <div class="col-xs-4">.col-xs-4</div> -</div> - -<div class="row"> - <div class="col-sm-4">.col-sm-4</div> - <div class="col-sm-4">.col-sm-4</div> - <div class="col-sm-4">.col-sm-4</div> -</div> - -<div class="row"> - <div class="col-md-4">.col-md-4</div> - <div class="col-md-4">.col-md-4</div> - <div class="col-md-4">.col-md-4</div> -</div> - -<div class="row"> - <div class="col-lg-4">.col-lg-4</div> - <div class="col-lg-4">.col-lg-4</div> - <div class="col-lg-4">.col-lg-4</div> -</div> - -<div class="row"> - <div class="col-xl-4">.col-xl-4</div> - <div class="col-xl-4">.col-xl-4</div> - <div class="col-xl-4">.col-xl-4</div> -</div> + <div class="row"> + <div class="col-xs-4">.col-xs-4</div> + <div class="col-xs-4">.col-xs-4</div> + <div class="col-xs-4">.col-xs-4</div> + </div> + + <div class="row"> + <div class="col-sm-4">.col-sm-4</div> + <div class="col-sm-4">.col-sm-4</div> + <div class="col-sm-4">.col-sm-4</div> + </div> + + <div class="row"> + <div class="col-md-4">.col-md-4</div> + <div class="col-md-4">.col-md-4</div> + <div class="col-md-4">.col-md-4</div> + </div> + + <div class="row"> + <div class="col-lg-4">.col-lg-4</div> + <div class="col-lg-4">.col-lg-4</div> + <div class="col-lg-4">.col-lg-4</div> + </div> + + <div class="row"> + <div class="col-xl-4">.col-xl-4</div> + <div class="col-xl-4">.col-xl-4</div> + <div class="col-xl-4">.col-xl-4</div> + </div> <h3>Three equal columns</h3> <p>Get three equal-width columns <strong>starting at desktops and scaling to large desktops</strong>. On mobile devices, tablets and below, the columns will automatically stack.</p> @@ -135,7 +135,7 @@ <hr> <h3>Column clearing</h3> - <p><a href="https://getbootstrap.com/css/#grid-responsive-resets">Clear floats</a> at specific breakpoints to prevent awkward wrapping with uneven content.</p> + <p><a href="../../layout/grid/#example-responsive-column-resets">Clear floats</a> at specific breakpoints to prevent awkward wrapping with uneven content.</p> <div class="row"> <div class="col-xs-6 col-sm-3"> .col-xs-6 .col-sm-3 @@ -164,10 +164,8 @@ <div class="col-sm-6 col-md-5 offset-md-2 col-lg-6 offset-lg-0">.col-sm-6 .col-md-5 .offset-md-2 .col-lg-6 .offset-lg-0</div> </div> - </div> <!-- /container --> - <!-- Bootstrap core JavaScript ================================================== --> <!-- Placed at the end of the document so the pages load faster --> diff --git a/docs/examples/jumbotron/index.html b/docs/examples/jumbotron/index.html index f66036b6434f63e2f58bb3020f1284e3a149ba98..27572dbfe5f372be8e8cb03dce9cbcea3c2f7aad 100644 --- a/docs/examples/jumbotron/index.html +++ b/docs/examples/jumbotron/index.html @@ -20,7 +20,7 @@ <body> - <nav class="navbar navbar-static-top navbar-dark bg-inverse"> + <nav class="navbar navbar-fixed-top navbar-dark bg-inverse"> <a class="navbar-brand" href="#">Project name</a> <ul class="nav navbar-nav"> <li class="nav-item active"> diff --git a/docs/examples/jumbotron/jumbotron.css b/docs/examples/jumbotron/jumbotron.css index ccf96fe4c4b8610e8a46453b5bfe5514d0dd9be0..2f72eb954a975025316d0b84417fc8f5048b4267 100644 --- a/docs/examples/jumbotron/jumbotron.css +++ b/docs/examples/jumbotron/jumbotron.css @@ -1,4 +1,4 @@ /* Move down content because we have a fixed navbar that is 50px tall */ body { - padding-bottom: 2rem; + padding-top: 2rem; } diff --git a/docs/examples/narrow-jumbotron/index.html b/docs/examples/narrow-jumbotron/index.html index b0ccda3c20edc3825230f058ad36e5d97f9774ec..3d96259e0b7a09a20fef51762f4c8e7d1997e1ae 100644 --- a/docs/examples/narrow-jumbotron/index.html +++ b/docs/examples/narrow-jumbotron/index.html @@ -74,7 +74,6 @@ </div> <!-- /container --> - <!-- Bootstrap core JavaScript ================================================== --> <!-- Placed at the end of the document so the pages load faster --> diff --git a/docs/examples/navbar-top-fixed/index.html b/docs/examples/navbar-top-fixed/index.html index 1ecbd2c3b42b719d8103b1303b6bed6940919c61..7e4d1e72e8dbcf3cf0bccb28d80788c37192d2ed 100644 --- a/docs/examples/navbar-top-fixed/index.html +++ b/docs/examples/navbar-top-fixed/index.html @@ -4,6 +4,7 @@ <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> + <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> <meta name="description" content=""> <meta name="author" content=""> <link rel="icon" href="../../favicon.ico"> @@ -21,12 +22,12 @@ <div class="pos-f-t"> <div class="collapse" id="navbar-header"> - <div class="container-fluid bg-inverse p-1"> + <div class="container-fluid bg-inverse text-white pt-1"> <h3>Collapsed content</h3> <p>Toggleable via the navbar brand.</p> </div> </div> - <div class="navbar navbar-light bg-faded navbar-static-top"> + <div class="navbar navbar-light bg-faded"> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar-header" aria-controls="navbar-header" aria-expanded="false" aria-label="Toggle navigation"></button> </div> </div> diff --git a/docs/examples/navbar-top-fixed/navbar-top-fixed.css b/docs/examples/navbar-top-fixed/navbar-top-fixed.css index 3e4f59f4b22f551a99cd79330aadd2730cfb8101..c77c0c1475bd7d71a83a731f091789b15f5a2a14 100644 --- a/docs/examples/navbar-top-fixed/navbar-top-fixed.css +++ b/docs/examples/navbar-top-fixed/navbar-top-fixed.css @@ -1,5 +1,5 @@ +/* Show it is fixed to the top */ body { - /* Show it's not fixed to the top */ min-height: 75rem; - padding-top: 6rem; + padding-top: 4.5rem; } diff --git a/docs/examples/navbar-top/index.html b/docs/examples/navbar-top/index.html index d86704e35758023340b6049d33cf9bb43117fe76..241a4e3aad8e446a2c65ebbc496ab586248005af 100644 --- a/docs/examples/navbar-top/index.html +++ b/docs/examples/navbar-top/index.html @@ -4,6 +4,7 @@ <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> + <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> <meta name="description" content=""> <meta name="author" content=""> <link rel="icon" href="../../favicon.ico"> @@ -20,12 +21,12 @@ <body> <div class="collapse" id="navbar-header"> - <div class="container-fluid bg-inverse p-1"> + <div class="container-fluid bg-inverse text-white pt-1"> <h3>Collapsed content</h3> <p>Toggleable via the navbar brand.</p> </div> </div> - <div class="navbar navbar-light bg-faded navbar-static-top mb-1"> + <div class="navbar navbar-light bg-faded mb-1"> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar-header" aria-controls="navbar-header" aria-expanded="false" aria-label="Toggle navigation"></button> </div>