Bootstrap Sass mixin for container?

There appears to only be one mixin for containers in Bootstrap 3. It is:

@mixin container-fixed($gutter: $grid-gutter-width) {
  margin-right: auto;
  margin-left: auto;
  padding-left:  floor(($gutter / 2));
  padding-right: ceil(($gutter / 2));
  @include clearfix;

Even when I define these variables as

$grid-columns:      12;
$grid-gutter-width: 30px;

The container does not have a max-width or breakpoints. There is no official documentation on how to properly use this mixin to define containers. Does anyone understand how to resolve this?

Okay. I also needed to add this to my particular class:

@media (min-width: $screen-sm-min) {
    width: $container-sm;
@media (min-width: $screen-md-min) {
    width: $container-md;
@media (min-width: $screen-lg-min) {
    width: $container-lg;

Solved my problem.


This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.