ブラウザでのDIVラッピングリサイズ

Question

基本的に私が設計しているウェブサイトはコンテナdiv内に3つのdivがあります。 1つは左に浮いている。右上に2つ、下に1つ。ブラウザが最大化されても正常に動作します。問題は、私は分の幅を設定したにもかかわらず、ブラウザのサイズを変更すると、右divは左のdivの下にラップします。私はdivがそのままのところに残るようにし、スクロールバーを代わりに表示したい。私はオーバーフローを試みました、運はありません。どんな解決策ですか？

PS-最初は、内側のdivにもmin-widthを追加しました。彼らは問題を解決するように見えなかったので、私はそれらを削除しました。 正しい方向の解決策やナッジが本当に感謝しています。

http://jsfiddle.net/R62w4/3/は、マシューをありがとう -

はここjsFiddleへのリンクです。これでラッピングの問題が修正されましたが、私のサイトには右側に細い線があります。どのように私はそれを削除する任意のアイデア？ヘッダーからフッターまで続きます。ヘッダーまたはナビゲーションバーまたはフッターに関連するCSS要素の変更の影響を受けません。

さて、私は右側に余分なスペースがある理由を見つけました。外側のdivのマージンを増やすと、スペースが増えます。スペースを取らずにマージンを増やす方法はありますか？

Answer 1

あなたはこの中でそれらをラップすることができるかもしれない：起きてからそれを防ぐために...

<div style="white-space:nowrap;"> 

</div> 

。

問題がどこにあるのか正確に知るのは難しいです。コードを投稿したり、JSFiddleを作成したりできますか？

更新：

私はこの問題は、あなたが利益のため％ベースの幅とPXを使用していることであると考えている - あなたが持っているし、その後、あなたのレイアウトが崩壊してしまうどれだけ利用可能なスペースのトラックを失うのは簡単です。 2つの左浮動DIVの幅が50％で、1pxのマージンのそれぞれが100％を超えるので、毎回2つの行に分割されることを考慮してください。

私は少しあなたのフィドルを変更：http://jsfiddle.net/R62w4/5/

...ちょうど親コンテナにあなたの他の二つから、あなたの最初のDIVと右マージンからの左余白を移動することによって、すべてのための十分な余地を与えているようです。

P.S. ％マージンを使用して、1行に入れたいものがすべて< = 100％のままであることを確認してください。

Answer 2

simpl css frameworkは、ピクセルベースのマージンを使用してパーセンテージベースの列を作成する方法を示しています。