2011-01-16 10 views
3

コンテンツの高さに関係なく、ブラウザウィンドウの下部に固定されたままにしたい(一部のページで)フッタを使用します。 www.facebook.comやmeeboツールバー(例:abduzeedo.com)などのサイトのブラウザウィンドウの下部に固定されているツールバーのいくつかと同様です。ウェブページのフッターがブラウザウィンドウの下部に残ります

私はいくつかのjQueryスクリプトとCSSハッキングをIEの非互換性について不平を言っているユーザーに見ています...これを行うための標準的な方法はありますか? meeboとfacebookを使っても、CSSソリューションは非常にしっかりしているのに対し、ツールバーはスクロールしながら少しジャンプするような感じです。シンプルなCSSソリューションはありますか?私はそれがフッタが下に絶対配置を持つ行に沿って何かであると仮定します:0 ...

+0

@atねえが、それは動作しませんでした... ?私はあなたがまだ答えを選択していないことに気付きました。 –

+0

私はちょうどIEでテストする機会がありませんでしたが、とにかく答えてくれました。ありがとう。 –

答えて

5

あなたは一番下、you should use the css fixed positionに "固執" するために何かをしたい場合。これにより、ウィンドウの下部に表示されます。

「絶対」を使用すると、最初の非静的要素に相対的なdivが配置されるため、正しいとは限りません。ほとんどの場合、これはウィンドウですが、そうである必要はありません。

HTMLコード:

<div class="bottom"><h1>Add to bottom</h1></div> 

CSSコード:

div.bottom { 
    position:fixed; 
    bottom:0px; 
    height:200px; 
    left:0px; 
    right:0px; 
    border:solid 4px red; 
} 
+0

ポジション:固定はまさに私が探していたものです。なぜこれを検索すると、多くのJavaScriptスクリプトとCSSハックがそれを動作させるのでしょうか?ポジションを使用して、問題、互換性またはその他の問題はありますか? –

+1

私は固定ポジショニングがバグであると信じています(もし正常に機能していないのであればIE6では....) – jlmakes

+0

@at well ...多くの人はCSSを知っていると思っています。 Julianが言っていることは事実です... IE6での実装はかなり厄介なことがあります。だからこそ、多くの人がハックを使用しています。 IE6の条件付きスクリプトをお勧めします。問題がある場合は低くしてください。しかし...それは動作するはずです。 –

0

CSSで絶対配置を使用します。

http://jsfiddle.net/TMD9X/

+0

私は分かりません。説明するためにフィドルをセットアップしていただけますか?ありがとう。 – PeeHaa

関連する問題