2

Foundation 6 scss コードに問題があり、助けが必要です。Sass ミックスインで次のコードを作成しようとしています。

<div class="row small-collapse medium-uncollapse large-collapse">
<div class="small-3 medium-6 large-3 columns bg-clip" style="background-color:yellow">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. 
</div>
<div class="small-3 medium-6 large-3 columns bg-clip" style="background-color:blue">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</div>

だから私はHTMLを持っています

<style>
  .bg-clip {
    background-clip:content-box;
  }
</style>

<div class="box-wrap">
  <div class="box bg-clip" style="background-color:yellow">sass grid</div>
  <div class="box bg-clip" style="background-color:blue">sass grid</div>
</div>

そしてscss

.box-wrap {
  @include grid-row;
  .box {
    @include breakpoint(small) {
      @include grid-column(3);
      @include grid-column-collapse;
    }
    @include breakpoint(medium) {
      @include grid-column(6);
      @include grid-column-uncollapse(30);
    }
    @include breakpoint(large) {
      @include grid-column(3);
      @include grid-column-collapse;
    }
  }

}

すべてが期待どおりに機能していますが、ブレークポイント (大) では grid-column-collapse が機能しません...

お時間をいただきありがとうございます

4

0 に答える 0