Redo jumbotron padding

[mdo]

Fixes #16374.

• In general, there are very few instances that would require a jumbotron without a parent or child container.
• Right now we account for that behavior though with some horizontal padding on the .jumbotron class.
• This removes that horizontal padding as it narrows our grid classes unnecessarily and accounts for a super small use case.
• It also improves consistency across breakpoints, in that padding isn't being added and removed.
• In doing so, I also removed the shorthand padding property and went with the specific ones (because yay specificity).

/cc @rlindner81

[rlindner81]

@mdo Awesome 👍

[inopinatus]

This was a surprise in 3.3.5. Removing the left padding on mobile devices leaves the jumbotron content looking unbalanced to me.

Case in point, see http://getbootstrap.com/components/#jumbotron with a narrow viewport or mobile device.

[rlindner81]

@inopinatus Good point. There are 2 main usecases for jumbotrons (inner container, outer container). We made the first act consistently and sensibly relative to the grid layout, but the second was broken.

The fix is easy enough though, should amount to changing jumbotron.less line 28ff to

  .container &,
  .container-fluid & {
    border-radius: @border-radius-large; // Only round corners at higher resolutions if contained in a container
    padding-left:  (@grid-gutter-width / 2);
    padding-right: (@grid-gutter-width / 2);
/*
    padding-left:  (@jumbotron-padding * .6);
    padding-right: (@jumbotron-padding * .6);
*/
  }

I would personally prefer that the left/right padding depends on the grid's gutter variable rather than the jumbotron's, but that's up to the maintainers.

See http://jsbin.com/goquvahito/edit?css,output for how the compiled version acts in both cases.

[freddyboucher]

As @inopinatus said

This was a surprise in 3.3.5. Removing the left padding on mobile devices leaves the jumbotron content looking unbalanced to me.

[rlindner81]

@freddyboucher did you read my response? It definitely is a bug. It's easy to fix though.

[freddyboucher]

@rlindner81
Yes thx, I've just posted a comment because I didn't see it in the 3.3.6 milestone https://github.com/twbs/bootstrap/milestones/v3.3.6

[mdo]

Please open a new issue with a JS Bin example demonstrating the bug and fix <3.