2011-09-26 6 views
0

私はdiv(それをヘッダーと呼ぶことができます)と別のdiv(呼び出しは内容です)を持っています。さて、コンテンツdivはその高さをその内容に拡張します。ヘッダー内では、私はコンテンツにはるかにオーバーラップする要素を持っていますが、コンテンツdivはヘッダーからオーバーラップする要素で伸びません。 Heresは私がこれまでに持っているCSS:他のdivの要素が重なったときにdivを拡張しますか?

.content { 
height:auto; 
} 

何か提案がありますか?子div要素はすべての上にその積み重ねられた道を意味する、何よりも高いのzインデックスを持っており、それは、その位置に文書「流れ」に参加していないためだ

http://jsfiddle.net/pgvZr/

+1

詳細を入力する必要があります。多分あなたのHTML、作業ページへのリンク、jsfiddleのデモなど –

+1

多分いくつかの例? – simoncereska

+0

コンテンツの中のコードとコンテンツdivのすべてのコードを投稿してください –

答えて

-2

。他の2つのdivの高さに基づいて高さを計算して設定するには、JQueryを使用することをおすすめします。

+1

いいえ、z-indexは、子と親の間のコンテンツのやり取り(つまり、#ヘッダとその内容)に影響しません。絶対的に配置された要素は、(上下の積み重ねを除いて)何かと対話しません。フロートした子どもにも同じことが当てはまります。つまり、フロートされていない親の高さに影響を与えません。 – Pat

0

"content" divがプッシュダウンされない理由は、 "header" divに高さが設定されているためです。したがって、「ヘッダー」divとの関連で、「コンテンツ」divは100ピクセル下がります。高さを設定しないと、 "header" divはその中に含まれるものの高さになります。

このフィドルを見てください...単にあなたのheight: 100px;をヘッダから外して、あなたが望むものを達成します。 http://jsfiddle.net/pgvZr/4/


編集:あなたは(つまり、あなたのコンテンツのdivがheader_innerテキストと一緒に成長している)ヘッダにコンテンツを追加し、それはあなたのコンテンツのdivの一部になりたい場合は、あなたはおそらくべきコンテンツdivに移動するだけです。さもなければ、あなたはヘッダーの高さを指定してはいけません、そして、あなたが私のフィードドのようにheader_innerを追加するとき、それはあなたのコンテンツdivを自動的にプッシュします。

+0

これは正しいことですが、それが彼の意図なら、彼の説明ではわかりません。私は彼がそれを使って拡大する青いコンテンツ領域にしたいと思う。 –

+0

コンテンツは単にプッシュダウンされているのではなく、ヘッダーに沿って高さが増していますか? – kafuchau

+0

はい、それは彼らが答えるのを待って、彼らが望むもののように私に読んでください。 jeroenのような音が聞こえたかもしれません。 –

0

私はこの問題を理解していません。 header_innerにテキストを追加してコンテンツの高さを拡張したいのですか?

+0

はいthats正しい –

+0

なぜあなたは.contentの中にheader_innerを持つことができませんか? – simoncereska

1

headercontentは兄弟で、これだけのCSS

あなたの問題を解決するには、することができます使用してheaderの一部であり、そのコンテンツを展開するcontentを持ってする方法はありません。

  • JavaScriptを使用するには、高さを計算するcontentは動的に設定する必要があります。
  • headercontentに入れて固定高さをcontent
関連する問題