Css 为什么列会破坏我的布局？

我使用的是susy2，我不明白为什么当我这样做时列会破坏我的布局：

body .conteneur{
    .col1_layout_2_7_3{
       @include span($mobilecol);

        @include clearfix;
        @include breakpoint ($tablet){
            @include span(1 of $tabletcol);
            background: #00CC99;
        }
        @include breakpoint ($desktop){
           @include span(2 of $desktopcol);
            background: darkorange;
        }
        //Pour orientation paysage
         @include breakpoint ($tabletlandscape){
           @include span(2 of $tabletcol-landcsape);
            background: violet;
        }
    }
    .col2_layout_2_7_3{
       @include span($mobilecol);

        @include clearfix;
        @include breakpoint ($tablet){
           @include span(5 of $tabletcol);

        }
        @include breakpoint ($desktop){
          @include span(7 of $desktopcol);

        }
        //Pour orientation paysage
         @include breakpoint ($tabletlandscape){
           @include span(5 of $tabletcol-landcsape);

        }

    }
    .col3_layout_2_7_3{
        @include span($mobilecol);
        @include clearfix;
        @include breakpoint ($tablet){
            @include span( 2 of $tabletcol);

        }
        @include breakpoint ($desktop){
           @include span(3 of $desktopcol);

        }
        //Pour orientation paysage
         @include breakpoint ($tabletlandscape){
           @include span(last 3 of $tabletcol-landcsape);

        }

    }
}

我不知道出血或隔离，但也许这是解决这个问题的方法。如果我使用最后一个，我的专栏会在左边留一个大的空白。 谢谢 编辑：css输出

body .conteneur .col1_layout_2_7_3 {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  overflow: hidden;
  *zoom: 1;
}
@media (min-width: 800px) and (max-width: 989px) {
  /* line 80, ../sass/layout/_layout-nodes.scss */
  body .conteneur .col1_layout_2_7_3 {
    width: 10.32338%;
    float: left;
    margin-right: 2.48756%;
    background: #00CC99;
  }
}
@media (min-width: 990px) {
  /* line 80, ../sass/layout/_layout-nodes.scss */
  body .conteneur .col1_layout_2_7_3 {
    width: 15.29605%;
    float: left;
    margin-right: 1.64474%;
    background: darkorange;
  }
}
@media (min-height: 767px) and (max-width: 1024px) and (orientation: landscape) {
  /* line 80, ../sass/layout/_layout-nodes.scss */
  body .conteneur .col1_layout_2_7_3 {
    width: 18.41584%;
    float: left;
    margin-right: 1.9802%;
    background: violet;
  }
}
/* line 98, ../sass/layout/_layout-nodes.scss */
body .conteneur .col2_layout_2_7_3 {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  overflow: hidden;
  *zoom: 1;
}
@media (min-width: 800px) and (max-width: 989px) {
  /* line 98, ../sass/layout/_layout-nodes.scss */
  body .conteneur .col2_layout_2_7_3 {
    width: 61.56716%;
    float: left;
    margin-right: 2.48756%;
  }
}
@media (min-width: 990px) {
  /* line 98, ../sass/layout/_layout-nodes.scss */
  body .conteneur .col2_layout_2_7_3 {
    width: 57.64803%;
    float: left;
    margin-right: 1.64474%;
  }
}
@media (min-height: 767px) and (max-width: 1024px) and (orientation: landscape) {
  /* line 98, ../sass/layout/_layout-nodes.scss */
  body .conteneur .col2_layout_2_7_3 {
    width: 49.0099%;
    float: left;
    margin-right: 1.9802%;
  }
}
/* line 117, ../sass/layout/_layout-nodes.scss */
body .conteneur .col3_layout_2_7_3 {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  overflow: hidden;
  *zoom: 1;
}
@media (min-width: 800px) and (max-width: 989px) {
  /* line 117, ../sass/layout/_layout-nodes.scss */
  body .conteneur .col3_layout_2_7_3 {
    width: 23.13433%;
    float: left;
    margin-right: 2.48756%;
  }
}
@media (min-width: 990px) {
  /* line 117, ../sass/layout/_layout-nodes.scss */
  body .conteneur .col3_layout_2_7_3 {
    width: 23.76645%;
    float: left;
    margin-left: 76.23355%;
    margin-right: -100%;
  }
}
@media (min-height: 767px) and (max-width: 1024px) and (orientation: landscape) {
  /* line 117, ../sass/layout/_layout-nodes.scss */
  body .conteneur .col3_layout_2_7_3 {
    width: 28.61386%;
    float: left;
    margin-left: 71.38614%;
    margin-right: -100%;
  }
}

---

现场演示：

我真的需要看一个符合我建议的CSS的演示。像这样使用隔离混合：@包括隔离。3%；我的问题似乎已经解决了……如果你有更好的办法，我知道；另一种方法是：@include span4$desktopcol排水沟覆盖：.5em；