問題タブ [css-float]

IE7とIE8は、DIVの1つに100％幅+ゼロ以外のマージンのテーブルがある場合、float：leftを使用して2つの結果のdivをレンダリングしません。

FireFox、Opera、Chrome、Safariではそのような問題はありません。

このIEバグの回避策を知っている人はいますか？

多くのフローティング子アイテムを含む div があります。各子項目は、入力とラベルを含む div です。Firefox では問題ないように見えますが、IE7 では、行の最後の項目が次の行に移動されるのではなく、収まるように折り返されます。

ラッピング商品 http://harriyott.com/images/wrapping.png

これを修正するにはどうすればよいですか?

私のサイトでは、ページを更新するまで、ほとんどのブラウザーでページが正しく表示されません。Web サイトは次のとおりです。 http://www.hqinternetsolutions.com/services.html

なぜこのように表示され、更新時に修正されるのかわかりません（キャッシュをクリアしなくても）

マージンを持って左にフロートされた一連の div です。何か案が？

スパンの1つに問題があります。次のスタイルを検討してください。

私のコードでは、次の3つのスパンがあります。

この問題は、「COL1CHE」に表示されるデータがない場合（または、よくわかりませんが、いずれかのデータでも）、このスパンが「折りたたまれ」、その幅が尊重されない場合に発生します。これはFirefoxで発生し、IEでは「崩壊」しません。

これが役立つかどうかを確認するために「明確な」クラスを含めましたが、役に立ちませんでした。

何か案は？

これが単純なものであることを願っていますが、すぐに解読できないようです...

2 列のレイアウトがあり、右側の列のコンテンツは動的で ajax 駆動です。したがって、ページの高さは、右の列にあるものによって異なります。

小さなフラッシュ ファイル (400px x 200px) をページの一番下、ただし列 1 の下にボルトで固定したいと考えています。

簡単だ。問題は..フラッシュの上マージンを -200px にしたいので、フラッシュ自体がはみ出さないようにします。これにより、無駄な空白も削減されます。

コードをかなり単純化しましたが、私の言いたいことがわかるはずです。シンプルな 2 列、列をクリアし、フラッシュ div に負のマージンを設定します。IE6、Safari では正常に動作し、Opera、Firefox、および Chrome では惨めに失敗します。

クリアの「スルー」でマイナスマージンを適用できますか?

すべての助けに感謝します;）

私の文言が不明確である場合は申し訳ありません。自分のジレンマを適切に説明する方法がまったくわかりませんでした。しかし、ここでもっとうまくできるかどうか見てみましょう...

投稿が縦ではなく横にスクロールして表示されるブログを作成しています。各ブログ投稿は個別の div に表示され、div は左側にフローティングして並べて表示されます。

しかし、自分のコンピューターの解像度、またはページを表示しているウィンドウのサイズに基づいて、div は、意図したように並べて表示するのではなく、互いの上に積み重ねられます。もちろん、画面の解像度がすべての div を表示するのに十分な大きさであれば、うまく機能しますが、そうではありません。

私が得ることができる助け、ヒント、および指針に感謝します。どうもありがとうございました。

編集 コードに関する限り、これは私が使用している基本的な HTML 構造と CSS です。

フロートされた画像の横に配置されたsifrに問題があります。Opera9.6では、テキストが画像をクリアして1行に表示するように強制されています。Firefoxはまた、ページが最初に読み込まれたときにテキストを強制的にクリアしますが、更新の修正によりこれが発生し、問題が再発することはなく、キャッシュがクリアされてブラウザが再起動された場合にのみ戻ります。

また、Firefoxに悩まされ、バグが発生してからFirebugをロードすると、画像に沿った正しい位置までテキストが表示されます。これは、Firebugによってdomがリロードされるとは思わなかったため非常に奇​​妙です。

http://www.thelisthq.net/datetest.php

互換モードをオフにしてFirefox、Chrome、またはIE 8でページを表示する場合、垂直メニューは正常に機能します。私の戦術は、メニュー全体を右にフロートさせ、箇条書き（右側の箇条書き）を逆にすることでした。以前のバージョンで表示すると、壊れます。これを修正する方法が思いつかず、さまざまなDoctypeを試し、多くの小さな調整を行いましたが、正しく機能させることができないようです。誰かが修正を知っているか、何か洞察を持っていますか？

divの高さを決定しようとしています。これは単純に聞こえますが、子孫のコンテンツのみがフローティングされるという事実によって複雑になるため、height/outerHeight (jQuery を使用)/clientHeight/offsetHeight を要求すると、ページ上で確実にレンダリングされることは明らかですが、0 しか返されません。高さのある。HTML 構造の例を次に示します。

「text-left」要素と「text-right」要素には「float: left;」があります。と「float: right;」そのため、「ルート」の高さを尋ねると、0 であることがわかります。ただし、もちろん、「テキスト 1」と「テキスト 2」の高さを取得すると、正しくそのことがわかります。それは20か何かです。

「ルート」要素の実際の高さを決定するにはどうすればよいですか? (たとえば、「text-one」の高さが 50 で「text-two」の高さが 20 の場合、実際の高さは 50 であることがわかります)

すべての子孫要素の高さを計算し、それらが浮いているかどうかなどを計算し、最終的な数値を得る何らかのロジックがあると思います...しかし、私はそれを解決するほど賢くありません。

前もって感謝します。

編集: HTML の変更 (たとえば、「クリア」を含める) はオプションではないことに注意してください。このdivの高さをそのまま伝えられるようにする必要があります。

可変幅の浮動要素を水平方向に中央揃えにする方法は?

編集：私はすでにdiv、浮動要素のコンテナを使用し、コンテナにを指定しwidthて（コンテナに使用margin: 0 auto;）、これを機能させています。包含要素を使用せずに、または少なくとも包含要素に a を指定しなくても実行できるかどうかを知りたかっただけwidthです。