[解決済み] テーブルセルの最大幅をパーセンテージで設定するには?
2022-08-18 03:04:37
質問
<table>
<tr>
<td>Test</td>
<td>A long string blah blah blah</td>
</tr>
</table>
<style>
td{max-width:67%;}
</style>
上記はうまくいきません。テーブルセルの最大幅をパーセンテージで設定するにはどうしたらよいですか?
どのように解決するのですか?
によると の定義によると、最大幅は の定義によると、"テーブル、インラインテーブル、テーブルセル、テーブルカラム、カラムグループに対する 'min-width' と 'max-width' の効果は未定義である" とされています。なので、td要素に直接max-widthを設定することはできません。
もし、2番目の列が最大で67%を占めるようにしたいだけなら、例えば、例のケースでは、幅 (これは事実上、テーブルセルの最小幅です) を33%に設定することができます。
td:first-child { width: 33% ;}
両方の列にこれを設定すると、ブラウザが列を同じ幅にする傾向があるため、それほどうまくいきません。
関連
-
[解決済み】divの高さを画面の残りスペースで埋めるようにする
-
ローカルリソースのロードが許可されていない問題を解決する
-
[解決済み] CSSでcellpaddingとcellspacingを設定する?
-
[解決済み] HTML5のlocalStorageにオブジェクトを格納する方法は?
-
[解決済み] How can I set the default value for an HTML <select> element?
-
[解決済み] How do I style a <select> dropdown with only CSS?
-
[解決済み] mailto:を使ってメールの件名や内容を設定することはできますか?
-
[解決済み] .css()を使って!importantを適用するには?
-
[解決済み] テーブル内のテキストアラインクラス
-
[解決済み] テーブルの列幅を、セル内のテキスト量に関係なく一定にする?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Uncaught TypeError: document.getElementsById は関数ではありません。
-
[解決済み] HTMLにおける'"'エンティティの使用法
-
[解決済み] HTMLのテーブルからボーダーを完全に削除する方法
-
[解決済み] bootstrapでボタンにリンクを貼るには?
-
[解決済み] CSSでテキストや画像の背景を透明にするには?
-
[解決済み] Sublime Text 2を使ってHTMLコードを再フォーマットするにはどうしたらいいですか?
-
[解決済み] インラインCSSでa:hoverを記述するには?
-
[解決済み] mailto:を使ってメールの件名や内容を設定することはできますか?
-
[解決済み] CSS 背景の不透明度 [重複]について
-
[解決済み] 親ディバイスの高さを指定せずに、子ディバイスの高さを100%にする方法は?