- ベストアンサー
テーブルを指定列幅で表示したい(画面に収まらなくていいので)
1280x1024のモニタを使ってますが 下記で、右端を突き破ってwidth="300"を効かせる方法を教えてください。 <html> <body> <table border="1"> <col span="10" width="300"> <tr> <td>NO</td> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>7</td> <td>8</td> <td>9</td> <td>10</td> </tr> <tr> <td>名前</td> <td>a</td> <td>a</td> <td>a</td> <td>a</td> <td>a</td> <td>a</td> <td>a</td> <td>a</td> <td>a</td> <td>a</td> </tr> </table> </body> </html>
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
<table>タグだとスクリーンを超える場合、width指定が100%(スクリーンサイズ)にデフォルト設定されてるので <table border="1" width="3300"> と変更するだけでいいです ちなみに僕も<col>タグと<colgroup>タグははじめて見ました よくサンプルプログラムを参考にさせてもらってるサイトで見たら確かにHTMLタグのところにありました htmlファイルをあまり使うことが無いのでちょっと新鮮(^^) ついでにだけど <col span="10" width="300">だと 10列を300pxにしてるので最初の『No』~10列なので『9』までしか300pxになりませんよ(><) <col span="11" width="300">に直してください m(--)m それにあわせて冒頭『3300』にしてます ↑別にこれは3000でもいいです。 <td width="***">と違って<col width="***">はテーブルサイズに合わせて列幅は微調整されるみたいですので・・・
その他の回答 (2)
追記・修正です。 300pxが10列分の長さではなく1列分の場合、300×10で3000ですね。 ちょっと長すぎな気がしますが、画面に収まらなくていいのでって書いていらっしゃるので…^^; <tr> <td colspan="10" width="3000"> </tr> 実際はcellspacing、cellpadding、border分の幅もあるので+αしたサイズで表示されるため、ジャスト3000にしたいなら余白やボーダー分の計算も必要です。 中身の合計サイズが3000を越えればそれ以上広がることもあります。
<col span="10" width="300"> このタグは存在しません。 ↓こんなかんじかな。 <html> <body> <table border="1"> <tr> <td colspan="10" width="300">10セル分ぶち破るぜ!</td> </tr> <tr> <td>NO</td> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>7</td> <td>8</td> <td>9</td> <td>10</td> </tr> 以下省略 300を指定していても、下の行で中身の合計サイズが300越えたら広がる場合もあります。
補足
choco003さん、早速ありがとうございました。 すみません、元質問の書き方が悪かったようです。 セルを結合したいわけではなく、 全ての列幅を300pxにしたいけどできません、という意味でした (書き忘れましたが当方IE7です)。 なお、 ><col span="10" width="300"> >このタグは存在しません。 ということですが、元質問のソースの5行目は <col span="10" width="300"> でなく、 <col width="300"> <col width="300"> <col width="300"> <col width="300"> <col width="300"> <col width="300"> <col width="300"> <col width="300"> <col width="300"> <col width="300"> と書いてもいっこうにかまわないのですが、10列全て300pxにしたいなら <col span="10" width="300"> という書き方をしてよいみたいです。 (IBMホームページ・ビルダー11で知りました)。 ご参考:http://www.sist.ac.jp/~suganuma/home/HTML/table/col.htm
お礼
leap_dayさん、ご教示ありがとうございました。 ご教示の通り、 カラム幅の合計値を<table widht="xx">として設定することで 解決しました。 ありがとうございました。