石積み：2列のレイアウトでは、1列の幅をもう1列の幅より広くするにはどうすればよいですか？

Question

だから私はこのように、2列の石工のレイアウトを作成しようとしています：、各グリッド項目に特定の幅を設定する必要がないよう、私は、これは自動的に動作するように取得するかどうかはわかりませんhttp://i.stack.imgur.com/gq6LJ.png

。

記事をループしているだけなので、特定の幅は設定されていません。私はちょうど右側のものが60％の幅で、左側のものが30％の幅であることが必要です。

<div class="grid"> 
    <div class="grid-sizer"></div> 
    <div class="gutter-sizer"></div> 
    <article class="grid-item"> 
     <!-- Content --> 
    </article> 
</div> 

Here is a codepen of my attempt at getting this to work.

は石造でこれでも可能ですか？

別のグリッドライブラリを使用していますか？

Answer 1

いいえ、私が読んだものから、石工はあなたのような項目の一つの列がそう望んでいる固定サイズを生成するためのものではありません...

私はjqueryのを使用して、ウィンドウの幅を取得し、その割合を割り当てますこのようなあなたのコンテナ要素に幅...

$(document).ready(function(){ 
    var cWidth = $(window).width() * .7; // 70% or whatever you want 
    cWidth.toFixed(0); 
    $('#container').width(cWidth); 

    $(window).resize(function() { 
     var crWidth = $(window).width() * .7; // 70% or whatever you want 
     crWidth.toFixed(0); 
     $('#container').width(crWidth); 
    }); 
}); 

は、その後、あなたの子要素（列）このようなCSSで幅...

.left-column { 
    width: 35%; 
} 

.right-column { 
    width: 65% 
}