2011-09-10 6 views
1

は、あなたがこのようなコードを持って考える私はこれがunderstantする方が簡単だろうと思って、コメントを読んでください:)コンテンツを展開するときにdivの下に押し込まれませんか?

<div class="container"> 
<div class="inner_container"> 

<div class="left"> 
This div sometimes expands to the right and pushes right div off the screen 
</div> 

<div class="right"> 
bla bla bla 
</div> 

</div> 
<div id='bottomcontent'> 
This content is below both of the divs, and when div '.right' expands down, I don't want this div pushed down as well, but have the 'right' div go under it/or just make those parts disappear and not push this div down. 
</div> 

</div> 

を。これは、CSSです:

.container { 
    width: 796px; 
    overflow:hidden; 
} 
.left { 
    float: left; 
    width: 256px; 
} 
.inner_container{ 
    width: 1396px; 
} 
.right { 
    float: left; 
    width: 796px; 
} 

どうもありがとうみんな、およびご質問がある場合、私はあなたに混乱するかもしれない何かを説明するために一生懸命努力します、ありがとう! :)

答えて

1

あなたがポジションを使用することができます。このような絶対的な:ありがとうFlowerking

#bottomcontent { 
    position: absolute; 
    top: 30px; 
    left: 256px; /* same as width of .left */ 
    background-color: white; /* if you dont want to see .right through #bottomcontent */ 
} 

jsFiddle

+0

ありがとうございました非常にピンチョン:) – pufAmuf

2

ここでは、オーバーフロープロパティを使用できると思います。申し訳ありませんが私はあなたの文脈をはっきり理解できないので間違っています。

あなたはこれを試すことができます。

.left { 
    float: left; 
    width: 256px; 
    overflow:scroll; 
} 

は画面から右のdivを押して避けること。

とbottomcontentクラスのためにあなたが位置を使用して試すことができます:絶対

+0

を、これも動作します:) – pufAmuf

関連する問題