div内のテーブルの幅がdivの幅を超えています
まず、テーブルのスタイルに注意してください
table
{
table-layout:fixed;
}
tableLayoutプロパティは、テーブルのセル、行、列の表示プロパティを設定するために使用されます。
table-layout
次の値があります。
価値 | 説明文 |
---|---|
自動 | デフォルト。列の幅はセルの内容によって設定されます |
修繕 | 列幅は、テーブル幅と列幅によって設定されます。 |
受け継ぐ | table-layout属性の値が親要素から継承されることを指定します。 |
テーブルの幅がそれを囲むdivの幅を超える場合、通常は最初にブラウザーで要素の属性を確認し、変更またはキャンセルしてスタイルの変化を観察する必要があります。私の実際の状況に関しては、最終的に、テーブルの幅がテーブルのelement.styleプロパティとセルコンテンツのwidthプロパティに関連していることがわかりました。これは最も重要な場所です。ソースが見つかったら、問題の解決は難しくありません。
セルのコンテンツの幅はここで簡単に変更できますが、element.style属性がどこからのものかわかりません。インターネットの助けを借りて、element.style属性がインラインスタイルであることを学びました。使用!必要な効果を得るには、重要な構文優先度を使用します。
それはこのスタイルであることがわかりました:
element.style {
width: 197px;
}
横幅が大きすぎるので、自動で幅を設定したい。次のように:
.table th{
width: auto ! important;
}
これで問題は解決しました。