1

これは基本的な質問だと思いますが、ここで解決策を見つけることができませんでした。

IE8 (互換モード) に表示する html ページがあります。悲しいことに、ヘッダーは必要なスペースをすべて使用しておらず、1 行ではなく複数行にわたって表示されています。同じ html ソースが chrome/firefox で動作しますが、quirks モードがオンの ie8 では動作しません。

IE8 で chrome の結果を取得するにはどうすればよいですか? マルチブラウザのサポートは必要ありません。IE8 のみです。

ドキュメント:

<html>
<head>
<style type="text/css">
.color5 {background-color:#DBEAF5;font-family:arial;font-size:8pt;font-weight:normal;}
</style>
</head>
<body>
<TABLE WIDTH="100%"  cellpadding=0 cellspacing=1 border=0  class="color6"    >
  <TR id="ED_ACTIONPLAN1_TR_1"  class="color5" >
<TD    WIDTH="47" class="color5" ALIGN=CENTER ></TD>
<TD    WIDTH="86" class="color5" ALIGN=CENTER >Code</TD>
<TD    WIDTH="285" class="color5" ALIGN=CENTER >Libelle</TD>
<TD    WIDTH="86" class="color5" ALIGN=CENTER >Priorite</TD>
<TD    WIDTH="86" class="color5" ALIGN=CENTER >Date de debut effective</TD>
<TD    WIDTH="109" class="color5" ALIGN=CENTER >Date d'echeance reelle</TD>
<TD    WIDTH="86" class="color5" ALIGN=CENTER >Taux de realisation</TD>
</TR>
</TABLE>
</body>
</html>

画像は、私の 1920x1080 画面の右上部分からのものです。

クロム：

クロームバージョン

IE8:

IE8 バージョン

4

3 に答える 3

0

このスタイルを使用してください。

<style type="text/css">
   .color5 {background-color:#DBEAF5;font-family:arial;font-size:8pt;font-weight:normal;text-align:center;width:auto;padding:5px}
</style>
于 2012-09-25T15:25:36.537 に答える
0

問題は、td要素に固定値 (ピクセルとして扱われる) を幅 100% のテーブルに与えていることです (つまり、実際のピクセル サイズはブラウザのサイズによって異なります)。

古いバージョンの IE では、指定された固定サイズでテキストが折り返され、テキストが 86 ピクセルまたは 109 ピクセルに収まりません。

固定数をパーセンテージに変換すると機能します

したがって、現在のピクセル値を合計すると、合計で 785 ピクセルになります。計算するとこうなります

<TABLE WIDTH="100%"  cellpadding=0 cellspacing=1 border=0  class="color6">
    <TR id="ED_ACTIONPLAN1_TR_1"  class="color5" >
        <TD WIDTH="6.02%" class="color5" ALIGN=CENTER ></TD>
        <TD WIDTH="10.95%" class="color5" ALIGN=CENTER >Code</TD>
        <TD WIDTH="36.30%" class="color5" ALIGN=CENTER >Libelle</TD>
        <TD WIDTH="10.95%" class="color5" ALIGN=CENTER >Priorite</TD>
        <TD WIDTH="10.95%" class="color5" ALIGN=CENTER >Date de debut effective</TD>
        <TD WIDTH="13.88%" class="color5" ALIGN=CENTER >Date d'echeance reelle</TD>
        <TD WIDTH="10.95%" class="color5" ALIGN=CENTER >Taux de realisation</TD>
    </TR>
</TABLE>

http://jsfiddle.net/gaby/4qhPZ/1/embedded/result/で動作するデモ

于 2012-12-22T01:54:55.923 に答える
0

クラスに追加するwhite-space: pre;と、IEで1行になります

于 2012-09-25T17:13:46.740 に答える