0

基本的にこの構造のページを作成しようとしています:

ここに画像の説明を入力

私がやろうとしているのは、スクロール スライドショーの大きな領域にコンテンツを配置し、コンテンツを白いサイド バーの左下にスクロールさせることです。それは十分に単純に思えますが、私は多くの異なる構造を試しましたが、これを行う最善の方法はわかりません.

タイルを作成して本体に配置し、y を繰り返すと、適切な視覚的結果が得られますが、コンテンツ ラッパーをその下の z-index に取得できません。サイドバーの高さを 100% にしようとしています。

4

3 に答える 3

1

すでに回答したことは知っていますが、短期的な解決策を探している場合は、レイアウトをだましてテーブルだと思わせることができます。

#outerwrapper {
    display: table;
    height: 100%;
}
#topbar { 
    display: table-row;
}
#innerwrapper {
    display: table-row;
    height: 100%;
}
#innerwrapper .leftdiv {
    display: table-cell;
}
#innerwrapper .rightdiv {
    display: table-cell;
}

未テストですが、少し調整すれば動作するはずです。

于 2013-04-30T17:01:56.833 に答える
0
body {
 width:100%;
 height:100%;
 line-height: 1;
 font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
 font-weight:300;
}
.content_wrapper {
 width:960px;
 margin:0px auto 0px auto;
}
.side_bar {
 width:250px;
 height:100%;
 background:#efeff0;
 position:fixed; right:0px; top:94px;
}
<div class="content_wrapper clearfix">
    </div>
    <div class="side_bar">
</div>
于 2013-05-01T16:46:56.647 に答える