1

Skeleton ボイラープレートを使用したシンプルな 2 列レスポンシブ デザインがあります。サイドバーの場合、コンテナ div内にこのdivがあります。

 <div class="container">
    <div class="four columns">
       /* logo and menu */
    </div>
    <div class="nine columns post">
       /* contents... */
    </div>
 </div>

広いビューポートでの表示方法と狭いビューポートでのスタック方法が気に入っていますが、サイドバー ( 4 列 div ) を広いサイズで常に左に固定し、他のdivのコンテンツをスクロールしたいと考えています。

いくつかのことを試しましたが、レスポンシブレイアウトを台無しにしてしまいました.CSSポジショニングの完全な知識がないと思います...

どんな助けでも大歓迎です!ありがとう。

4

2 に答える 2

3

Skeleton Boilerplate を使用していると読みました。

<nav>ロゴとメニューを要素に入れることをお勧めします。を閉じるときは</nav>、改行なしスペース ( &nbsp;) を挿入します。この改行しないスペースが問題を解決してくれることを願っています!

 <div class="container">
    <div class="four columns">
       <nav>
       /* logo and menu */
       </nav>
       &nbsp;
    </div>
    <div class="nine columns post">
    /* contents... */
    </div>

次に行うことは、CSS ファイルに移動して挿入することです。

nav{ position:fixed; width:220px; /*found the width-info on Skeleton website*/ }

うまくいったかどうか教えてください!

于 2012-11-14T20:59:18.370 に答える
0

そのためには、「スティッキー」なdivが必要です。

ウェイポイントを使用してみてください

于 2012-11-07T04:21:11.403 に答える