0

ヘッダー、コンテンツ、「スティッキー」フッター、サイドバーを含むWebサイトのレイアウトに問題があります。粘着性のあるフッター、ヘッダー、コンテンツの組み合わせ自体は問題ではありませんが、ヘッダーからフッターに至るサイドバーを、の「粘着性」を台無しにせずに追加する方法を一生理解することはできません。フッター。

私がそれに近づいている方法は、絶対的なポジショニングを含みます。基本的に、ヘッダーdiv(height: 71px; top: 0px;)、フッターdiv(bottom: 0px; height: 30px;)、コンテンツdiv(top:71px;bottom:30px;)を作成します。次に、コンテンツdiv内に残っているサイドバーをフロートさせて高さを100%にし、実際のサイトコンテンツの横に別のdiv(「ビュー」と呼びます)を追加します。これにより、サイドバーが上から下にうまく配置され、フッターが通常はページの下部に表示されます。

ただし、このアプローチでは、ウィンドウのサイズが変更された場合、特にコンテンツが大きすぎて「ビュー」div自体に収まらない場合に問題が発生します。これにより、フッターがコンテンツを切り取り、下にスクロールするとフッターがウィンドウ内で上に移動します。このように動作するフッターを実現したいのですが、常にページのヘッダーからフッターまで伸びるサイドバーもあります。

上にリンクされているページにそのようなサイドバーを追加する方法を誰かが考えたり、この問題に取り組む方法について何かアイデアがあれば、大いに感謝します。よろしくお願いします。

4

2 に答える 2

1

divの高さと位置だけでなく、HTMLとCSSの例を投稿できると思いますか?

私が考えていたのは<div>、サイドバーの内側に別のものを投げ<div>て、margin-bottomまたはpadding-bottomをに設定できるということ30pxです。私はあなたのためにjsFiddleに取り組みます。

于 2012-04-28T05:09:20.707 に答える
0

overflow: autoあなたはいつでもあなたのビューdivに置くことができます。

http://jsfiddle.net/dzRZd/

編集:

代わりに固定ポジショニング:http: //jsfiddle.net/ekSvQ/2/

于 2012-04-28T05:29:52.433 に答える