What does @include container mean?

问题:

I am getting started with Compass and Susy. My goal is to make my layout adapt to phone, tablet, and desktop screen sizes. In the Susy examples (susy.oddbird.net or SO question), there is a pattern of having the number of columns adapt to the screen size. Specifically, there are nested rules like these:

.container {
  @include container;

  @include desktop {
    @include container;
  }
}

My questions now: What does the container { @include container } do? And, why is it nested again in the desktop include?

回答1:

The container mixin establishes the width of your page. You only need to repeat it at different breakpoints if that width should change (as they would with adaptive layouts). If you are using a fluid grid, there is no need for the repetition.