CSSテキストオーバーフローのバグ？ Google Chrome

私は、PHP、MySQL、CSS、HTML、および一部のスクリプト言語を使用して最初から自分のサイトを作成しています。出会い系サイトです。私の悪い英語で申し訳ありませんが、私の母国語ではありません。私が直面したすべての他の問題/問題に対する解決策を見つけました。しかし、ブラウザ間の互換性をテストし始めたときに、Chromeで不思議なバグが発生しました。ウェブサイトはここにありますhttp://www.writech.net.ee/testsite CSSテキストオーバーフローのバグ？ Google Chrome

サイトの考え方は、誰かを相手にしたいと思っている人はすべて、フォームに記入して連絡先データと説明を記入して提出することです。すべての広告はフローティング部門として表示されます。これらのdivは左にフローティングされます。 divは固定された高さを持っているので、誰かが長い記述を書くとdivに適合しないとスクロールバーが表示されます。説明テキストを保持するdivには、1pxの赤い枠線が表示されます。
IE9とFirefox 11ではadvert divはOKですが、Chromeではdivに適合する余分なテキストを含むdivが適用されるはずです。なぜなら何らかの理由で垂直スクロールバーを表示するために "overflow：auto"を適用する必要があります。。最初は私は問題がスクロールバーの表示に関連していると思った、 "オーバーフロー：隠し"を試みた - オーバーフロー：隠された過剰なテキストがdivはまだ他のdivsに比べて上昇して表示されます。問題は、divに含まれるテキストの量に関連しています。
前回のクロスブラウザ適応経験がないため、どこを見て何をすべきかわかりません。 CSSハックを試してみる人はいますか？

出典

2012-04-04 Robert

何か：ページの 1.チェック検証をいくつかの検証エラーがあります（主に繰り返し：http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.writech.net.ee%2Ftestsite%2Findex.php%3Fid%3Dnaine_meest）これらのほとんどは＆i URL（
、末尾は

）を伴いません（/部分）、複数回使用されるID（代わりにクラスを使用します）。それらを修正し、それが役立つかどうか確認してください。 – Holger

は、私はそれがこの問題が発生していますが、topにご.box ESのvertical-alignプロパティを設定した場合、それが動作することを少し奇妙だと思うと言っています。

出典

2012-04-04 08:55:11 powerbuoy

ありがとうございました！それは魅力のように働く。なぜ私は最初の場所でこれを試していなかったのか分かりませんが、簡単な解決策です。 :) – Robert

.boxクラスでブロック表示（インラインブロックatm）を適用し、float：leftをスローすることもできます。 .box {vertical-align: top}を：（ライン324）

出典

2012-04-04 08:52:03 Ray

これを試してみてください。この不具合は今では消えていますが、divは前に水平方向に中央に配置されていましたが、すべて左に揃えられています。 – Robert

（私の代わりに）以下に掲載されたメソッドを使用してください。これは、浮動小数点の問題を修正する必要があるという少し面倒を節約します。 – Ray

私は前と同じような問題がありました。浮動小数点は左に働きました。同じソリューションを使用することもできますが、ボックスを含むdivを中央に配置する方法を変更する必要があります。私は（あなたがあなたにスタイリングを移動することができ、もちろんのファイルを、CSS）以下で、それはMacBookの上で右Chromeで見てもらうために管理：上を開始する

<div style="margin-left: auto; margin-right: auto; width: 1080px;"> 
    <div class="box" display="float:left"> 
    ... 
    </div> 
    <div class="box" display="float:left"> 
    ... 
    </div> 
    ... 
</div>

出典

2012-04-04 09:24:08 tsherif

CSSテキストオーバーフローのバグ？ Google Chrome

答えて

関連する問題