高さの100％のdiv

コンテンツがない場合は、ヘッダーとフッターの間にページを埋めたい#main divがあります。内容がある場合、それは粘着性のフッターを押し下げるべきです。高さの100％のdiv

CSS：これが機能しない理由

#main { 
background: transparent url("images/main-content.png") top right repeat-y; 
clear: both; 
overflow: hidden; 
margin-top: -10px; 
height: 100%; 
min-height: 100%; 
}

は私はわかりません。 #mainは#wrapperとbodyから継承しているので、100％の高さと100％の最小高さを設定すると効果があります。

サイト：これであなたの助けを事前に

http://www.dentistrywithsmiles.com

感謝。

出典

2011-02-09 blackessej

CSSファイルののどこか近くにあるのはheight: auto !important;です。

ラッパーの高さを100％オーバーライドしています。これは、メインディビジョンが成長しないようにしています。あなたのフッタは一定の高さを持っているので、私はフッタにメインのコンテンツdivを食べさせないように、ラッピングにパディングを追加しようとします。これはあなたがheight: auto !important;を回したときに起こることです。

出典

2011-02-09 22:02:43 Blender

ありがとう@Blender - 追加する埋め込みの例を挙げることはできますか？パッディングを '＃wrapper'の底に追加すると、私のフッタを押し下げてしまい、粘着性を残しておきたいのです。 – blackessej

申し訳ありませんが、私はやるべきことがたくさんあるので、後で私は何かを鞭打つかもしれません。あなたのコンテンツ 'div'がページをいっぱいにする高さを仮定していて、ページの高さの上にフッタをクロールさせないのであれば、なぜ固定フッタで解決しますか？あなたはそのdivの最小の高さを指定するだけで、設定することができます。すでにそのfooterの 'div'をプッシュしています。ちょっと考えて... – Blender

完全には必要ではないかもしれませんが、ページに多量のコンテンツがない場合、どのような画面解像度とブラウザーにもかかわらずコンテンツ 'div'がフッターを満たしているように、固定フッターを保持したいと思います。それはクライアントにとって重要なことです。 – blackessej

display:inline-block~#main（または、実行する内容に応じて#wrapper）を追加します。 display:blockのアイテム（デフォルトでdivタグやpタグなど）は、コンテンツに合わせて100％の幅と高さを持っています。

出典

2011-02-09 22:10:21

答えて

関連する問題