html - HTML / CSS：このテーブルのサイズを設定するにはどうすればよいですか？

Question

以下のリンクにアクセスしてカートにアイテムを追加すると（カートをサイドバーに表示するため）、カートがサイドバーウィジェットの端を超えて重なっていることがわかります。

テーブルを親コンテナのサイズにするために、どのCSSを作成する必要がありますか？

score 3 · Accepted Answer

table-layout：fixedをに書き込みますtable.eshop。このように書く：

table.eshop {
    border-collapse: collapse;
    table-layout: fixed;
    width: 99%;
    word-wrap: break-word;
}

score 2 · Accepted Answer

thとtd要素のパディングを変更する必要があります。

table thead tr th,
table tfoot tr td {
  padding: 8px 10px 9px;
  font-size: 14px;
  font-weight: bold;
  color: #222;
}

カート内の0〜9個のアイテムの場合5、左右の適切なパディングとして機能します。高くしたい場合は、それを低くする必要があります。

table thead tr th,
table tfoot tr td {
  padding: 8px 5px 9px;
  font-size: 14px;
  font-weight: bold;
  color: #222;
}

もう1つのオプションは、フォントサイズを変更することです。それは本当にあなた次第であり、あなたが考えるものは使いやすさを損なうことなく機能します。

2 に答える 2