2行2列のテーブルを作ろうとしています。1行目にthの要素を2つ、2行目にtdの要素を2つ入れます。そして1列目(左側の列)の幅を40%、2列目の幅を60%にしたいのですが、実際にやってみたところ、列幅が半々になってしまいます。どのようにすれば良いでしょうか?(本当は表示するデータをデータベースから取ってきているので、PHPで書いています。)
PHP
1echo "<table class=\"top\">"; 2echo "<tr><th class=\"left\">左</th>"; 3echo "<th class=\"right\">右</th></tr>"; 4echo "<tr>"; 5echo "<td class=\"left\">"; 6echo $number1; 7echo "</td>"; 8echo "<td class=\"right\">"; 9echo $number2; 10echo "</td>";
CSS
1table.top th{ 2 padding:4px; 3 text-align: left; 4 vertical-align: top; 5 background-color: #d2cce6; 6 border-left: 1px solid #003567; 7 border-top: 1px solid #003567; 8 border-right: 1px solid #003567; 9 border-bottom: 1px solid #003567; 10} 11 12table.top th.left{ 13 width:40%; 14} 15 16table.top th.right{ 17 width:60%; 18} 19 20table.top td{ 21 padding:4px; 22 border-left: 1px solid #003567; 23 border-top: 1px solid #003567; 24 border-right: 1px solid #003567; 25 border-bottom: 1px solid #003567; 26} 27 28table.top td.left{ 29 width:40%; 30} 31 32table.top td.right{ 33 width:60%; 34}
回答2件
あなたの回答
tips
プレビュー