Susy：ブレークポイントでbleed（）を無効にする

Question

例2のbox4（黄色のボックス）が紫色の列の間に戻って折り返されないように、小さなブレークポイントでbleed-x（）ミックスインを元に戻すにはどうすればよいですか？次の行

.story4 { 
    @include bleed-x(); 
    @include span(2); 
    background: yellow; 
    height: 80px; 
    @include breakpoint($small) { 
    @include span(8 last); 
    } 
} 

Codepen：

http://codepen.io/meijioro/pen/aBdWyO

Answer 1

ブリードは、負のマージンと正パディングの組み合わせです。上書きする0の両方をリセットします。

一般に

@include breakpoint($small) { 
    @include span(8 last); 
    margin: 0; 
    padding: 0; 
} 

、私は元のアプリケーションを制限することにより、ブレークポイントの上書きを避けるようにしてください。これ以上のもの：

.story4 { 
    @include span(2); 
    background: yellow; 
    height: 80px; 

    // use your own tools to create max-width breakpoints... 
    // this limits the bleed, so we don't have to override it later. 
    @media (max-width: $small) { 
    @include bleed-x(); 
    } 

    @include breakpoint($small) { 
    @include span(8 last); 
    } 
}