singularitygs - ピクセル測定によるネストされたグリッド

Question

私は特異点（およびグリッドシステム）を始めていますが、もちろん問題に遭遇します。ここにあります。

私はこのHTMLマークアップを持っています:

<div id="wrapper">
  <div id="main">
    <div id="first-column">content</div>
    <div id="second-column">content2</div>
  </div>
</div>

この非対称グリッドをセットアップしました：

$grids      : 97px 263px 263px 97px;
$gutters    : 70px;

そして、このscss：

#wrapper {
  @include background-grid;
  width: 930px;
  margin: 0 auto;
}
#main {
  //@include background-grid;
  @include grid-span(2, 2); //this element is spanned acros two columns in the middle
}
#first-column {
  @include grid-span(1, 1); //should be spanned acros first column in #main
}
#second-column {
  @include grid-span(1, 2); //this element should be spanned acros second column in #main
}

問題は、#main には 2 つの列 (および 1 つのガター) しかないという事実を内側の div に認識させるにはどうすればよいかということです。代わりに、#main がデフォルトのグリッド設定を継承しているように見えます。

@include レイアウトを介して #main グリッドを変更するなど、多くのオプションを試しました。または、列を追加して正しいコンテキストに適応するように指示します@include grid-span(1, 1, 2);(3 番目の数字は、それがデフォルトのグリッド コンテキストにあることを div に伝える必要があります。しかし、無駄です。問題はデフォルト グリッドの px 定義にあると思われます。内部の div は多くの時間を 1.356% の幅しか持たず、これは私には疑わしいように見えます。

提案をありがとう。

編集:私は正確な px ディメンションを追加しようとし、ネストされたコンテキストを追加することと組み合わせて、その想定のように見えますが、それはどのように機能するべきではないと思いますか??

#block-formblock-contact-form {
  @include  grid-span(1, 2, 2);
  width: 263px;
}

#block-system-main {
  @include  grid-span(1, 1, 2);
  width: 263px;
}