宜しくお願い致します。
■問題点
2行目にあるthは2つあるのですが、2行目の2つ目のthだけが固定値にならない。
(下記ソースの「テスト項目3」の部分です)
■やりたい事
全部で3つあるthをcssで全て固定幅にしたい。
■やった事
・thに直接width="170"
・thに直書きでwidth:170px;
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>テストページ</title> <style> .shipment_data { width: 100%; table-layout:fixed; margin: 20px 0; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; } .shipment_data th { background: #f3f3f3; width: 170px; } .shipment_data th { padding: 9px 10px 8px; box-sizing: border-box; border-top: 1px solid #ccc; border-left: 1px solid #ccc; text-align: left; vertical-align: top; word-break: break-all; } .shipment_data td { padding: 9px 10px 8px; box-sizing: border-box; border-top: 1px solid #ccc; border-left: 1px solid #ccc; text-align: left; vertical-align: top; word-break: break-all; } </style> </head> <body> <table class="shipment_data"> <tr> <th>テスト項目1</th> <td colspan="3">テストテストテストテストテストテストテストテストテストテストテストテスト</td> </tr> <tr> <th>テスト項目2</th> <td>テストテストテストテストテスト</td> <th>テスト項目3</th> <td>テストテストテストテスト</td> </tr> </table> </body> </html>
ソースを表示してみました。
2行目の2つ目のthだけが固定値にならない。
とありますが、
もう少し具体的に言うとどういうことでしょうか?
どういう感じにしたいという風に書いてもらえると
助かります。
ご連絡ありがとうございます。
thにたいしてcssで横幅170pxを指定しているのですが、ウィンドウサイズの横幅を狭めたときに1行目と2行目の1つ目のthはcssで指定した170pxのままなのですが、2行目2つ目のthだけ横幅が変わってしまいます。
thに対してcssで横幅170pxの指定がしてあるので、ウィンドウサイズの横幅を狭めたときに3つのthが横幅170pxになるとおもっているのですが、なぜか2行目2つ目のthだけウィンドウサイズの横幅を狭めたときに170px以下の幅になってしまいます。
この3つ目のthも横幅を狭めたときに170pxになっていてほしいです。
宜しくお願いいたします。
回答1件
あなたの回答
tips
プレビュー