Created by: Nikita240
Let's start with a problem. Take a look at your basic jumbotron example and change one thing: use .navbar-static-top instead of .navbar-fixed-top. This is what it looks like:
The white space above the navbar is there because in the jumbotron example, the body has a padding-top of 50px to line up the jumbotron with the navbar. However, this only worked because with .navbar-fixed-top the navbar was not affected by the padding. Now with .navbar-static-top we can no longer use this trick. So let's remove the body padding:
Now there is just the margin from the navbar to deal with. The way I see it, there is two ways to go about it:
A: Add a negative margin-top on the jumbotron equivalent to the margin-bottom of the navbar.
B: Remove the margin-bottom from the navbar.
A is bad because it means we have to set an absolute value, which means that in the event of any changes to the navbar margin, we must remember the change to jumbotron margin. B is bad because it means you can't use the same html for the jumbotron page as non-jumbotron pages (and most web implementations do like to reuse the navbar code on all pages).
But how nice would it be if there was a @jumbotron-margin-top variable in less so you could just add @jumbotron-margin-top: -@navbar-margin-bottom; to your variables file and forget about it?