1

私は少しグーグルをして、私が解決しようとしている問題への参照をいくつか見つけましたが、すべて私が使用できない同じ解決策を示唆しています. 問題は、サイドバーが右に浮いていて、サイドバーから残った幅に拡張する必要があるいくつかの div がありますが、サイドバーがそれらを妨げなくなったときに全幅に拡張することです。

jsfiddle はこちら: http://jsfiddle.net/qdk3n/

overflow: hidden;他の場所で見つかった解決策は、.left項目に適用することです。これはまさに私が望む効果を実現します。サイドバーと水平スペースを共有する div はサイドバーまでしか拡張されませんが、追加の div は許可された幅全体に拡張されます。残念ながら、左側の div 内に div のサイズを超える絶対位置の項目があり、適用するとトリミングされるoverflow: hidden;ため、使用できません。を使用せずに私がやろうとしていることを達成する方法はありますoverflow: hidden;か?

注: ページをレンダリングする前に、サイドバーまたは左側の div のいずれかのサイズがわかりません。また、Javascript をどのような方法、形状、または形式でも使用することはできません (これは、JS が無効になっているユーザー向けに設計されているためです)。 ）。これらすべてで設定できる唯一の寸法は、サイドバーの幅です。div は流動的である必要があり、一部だけを拡張するためにいくつかの div を任意に選択することはできません。

また、注意してください: 私はこれを見てきました: Div ストレッチしてから、他の浮動 div をラップします。それはまさに私がやろうとしていることですが、唯一の本当の解決策はoverflow: hidden;プロパティであり、それを使用することはできません.

4

1 に答える 1

0

私が何かを見逃していない限り、あなたが求めるものを正確に達成することは不可能だと思います.

overflow: hidden;( ) 要素の動作を変更する理由は、 display: block;「ブロック フォーマット コンテキスト」と呼ばれるものです。これについては、こちらを参照してください。

https://developer.mozilla.org/en/CSS/block_formatting_context http://www.communitymx.com/content/article.cfm?cid=6BC9D

技術的には、左側の div もフローティングすることで、要素display: block;を保持し、フロートされたサイドバーを尊重させることができますが、これでは期待どおりの効果が得られません。

ただし、左側の div 内のインライン コンテンツはフローティング サイドバーを尊重するため、div があなたが説明したように動作する必要はありません (より建設的なフィードバックを得るために、その背後にある理由について詳しく説明してください)。

于 2012-05-12T01:24:10.563 に答える