Skip to content

Instantly share code, notes, and snippets.

@mattnorris
Last active December 14, 2015 16:19
Show Gist options
  • Save mattnorris/5114010 to your computer and use it in GitHub Desktop.
Save mattnorris/5114010 to your computer and use it in GitHub Desktop.
By default, Twitter Boostrap pads the body of mobile browsers with a media query. This makes your site look good in most cases, but works against you if you want a Jumbotron-style header. This code overrides the body padding, but retains it for container-fluid divs.
// Tablets and below
@media (max-width: 767px) {
// Remove the extra padding for media queries so the Jumbotron
// still spans the full width of the page, even in mobile browsers.
// Instead, move the padding into the container-fluid class.
body {
padding-left: 0;
padding-right: 0;
}
.container-fluid {
padding-left: 20px;
padding-right: 20px;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment