0

現在、ウェブサイト全体をやり直しています。現在のWebサイトは7年以上前のものですが、Webkitベースのブラウザー（ChromeおよびSafari）でのみ発生するCSSのバグがあるようです。新しいサイトの準備が整うまでに時間がかかる場合があるため、このバグを修正したいと思います。

固定幅のテーブルがあります。

<table width="1000" border="0" cellspacing="0" cellpadding="0" bgcolor="#FFFFFF">
    <tr>
        <td class="left" width="200" valign="top">
            Contents of the menu here.
        </td>
        <td valign="top">
            <table width="100%" border="0" cellspacing="0" cellpadding="0">
                Contents of website here.
            </table>
        </td>
    </tr>
</table>

関連する要素とクラスのCSSは次のとおりです。

td {
    font-size: 11px;
}

td.left {
    width: 200px;
    padding-top: 50px;
    background-color: #EFEFEF;
}

td.top {
  height: 16px;
  align: right;
  padding-bottom: 2px;
}

問題は、Webkitがクラスを残したtdを200ピクセルではなく161ピクセルとして計算することです。またはを追加することでこの問題を解決できますが、これを行うと、Webkitは最初のテーブルのサイズを1000ではなく1039ピクセルに変更し、ページの残りの部分をあちこちに移動させます。固定幅の要件を完全に無視しているようです。style="display: block"style="min-width: 200"

ウェブサイトの構造を大幅に変更せずにこれを修正する方法があるかどうか知りたいです。必要に応じて、問題のWebサイトでCSSを試してみることができます。バグはChromeとSafariでのみ発生することに注意してください。Webkitの多くのバグレポートと多くのStackOverflowの質問を確認しましたが、どれも私の問題と完全には一致していないようです。

4

3 に答える 3

1

問題は、右側の「スポンサー」テーブルの画像だと思います。

左側のテーブルにmin-widthを設定し、「sponsoren」テーブルのdiv-tagにwidth：150pxを設定するとうまくいきます。

于 2012-09-20T14:23:55.373 に答える
1

うわー、そのような基本的なスクリプトでテーブルを使用しないでください。divを使用してください：

<div style="width:1000px; background-color:#ffffff; float:left; clear: both;">
    <div style="width:200px; float:left;">
        Contents of the menu here.
    </div>
    <div style="width:800px; float:right;">
        Contents of website here.
    </div>
</div>

これで問題が解決するはずです。

于 2012-09-20T14:14:30.647 に答える
0

クラス クラスをテーブルに追加してみてください。

table.yourclass {
    width: 1000px !important;
}
于 2012-09-20T14:13:10.443 に答える