問題タブ [two-column-layout]

ユーザーがスクロールを開始したときに、この右側のサイドバーを静的にするのを手伝ってください。レスポンシブタイプのウェブデザインは初めてです。「position：fixed」プロパティを使用しようとしましたが、レスポンシブデザインでの実現可能性がわかりません。私を助けてください。これはリンクhttp://the-bootstrap.obenland.it/page-with-comments/です

以下に示すように、2 列のレイアウト ビューを実装しています。

ただし、マリオネット複合ビューを定義すると、単一の itemViewContainer のみが許可されるようです。

このようなことはできますか？

基本的に、リスト テンプレートの「左」列と「右」列にミューズを交互に挿入したいと考えています。複合ビューで定義することは可能ですか?

レスポンシブ 2 カラム レイアウトが進行中です。最初の列は固定幅ですが、2 番目の列は csscalcプロパティを使用して、100% の幅から特定のピクセルを差し引いています。

2 番目の列でやりたいことは、画面のサイズや幅に関係なく、水平方向にスクロールすることです。私がやろうとしていることを説明するために簡単なペンをまとめました: http://codepen.io/trevanhetzel/pen/nbdIt

ご覧のとおり、2 番目の列には複数の.thingdiv があり、左にフロートされ、幅が定義されています。私が望まないのは、これらの.thingdiv が 2 番目の列内のスペースを使い果たしたときに別の行にドロップダウンすることです。

これはどのように達成できますか？プロパティをいじってみoverflowましたが、別のコンテナ div に別の配置プロパティなどが必要になるのではないかと思います。何かアドバイス？

モックアップ

概要

すべては、スクロール付きのボタンを備えたImageViewです。

要件

画像表示に2段固定レイアウトを実装したい。

ボタンを押すと、その画像が検出されます。

画像が 1 つしかない場合は、レイアウトに画像を 1 つだけ表示します。

誰かが解決策を知っている場合は、共有してください。

よろしくお願いします。

2 列形式の記事のレイアウトがあり、各記事は独自のもの.box-wrapで、CSS でフローティングして列に積み上げます。

問題は、次のボックスが列に正しくスキップされることですが、(場合によっては巨大な) マージンが作成されるため、その上部が反対側の列の上のボックスの下部に揃えられます。

実際には個別の要素として定義された2つの列でこれを完全に機能させdivましたが、これには2つのループが必要でした（CMSにWordpressを使用しています）。つまり、両方で「無限スクロール」を（特に簡単に）機能させることができませんでした列。

私はフィドルを持っていません.

助言がありますか？

前もって感謝します。

編集：提案ごとに石積みを使用しています。しかし、それは機能していません。サイトの読み込みが遅くなったように見えますが、実際には望ましい効果はありませんでした..

私は2列のレイアウトを持っています。フレックス レイアウトは、サポートしたいすべてのブラウザーでサポートされているわけではないため、 と を使用display: tableしdisplay: table-cellました。

私の現在の問題は、の上部のパディングを変更すると#sidebar > div > div、MAINコンテンツが影響を受けることですが、影響を受けるべきではありません。したがって、2 つの質問があります。

• の上部パディングのMAIN変更によってが影響を受けるのはなぜですか?#sidebar > div > div
• 影響を受けないようにするにはどうすればよいですか？

HTML

CSS

jsFiddle — パディングを変更するだけです。