- 締切済み
セルのサイズ指定が反映されないのですが・・・
テーブルを使用したページを作成していたのですが、 そのテーブル内に、2つの画像とその間に文字を入れるセルを作った所、 セルの横幅にはまだ余裕があるにもかかわらず、途中で改行が入ってしまいました。 ___________ │●あい │ │ │う● │ ̄ ̄ ̄ ̄│  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ 構成として、改行を入れたくなかったので、<style>でnowrapを指定した所 セルの横幅が広くなり、無駄な余白ができてしまいました。それをなくしたくて HTMLやCSSでセルのサイズを指定したのですが、なぜかサイズが変化しません。 ________________ │●あいう● │ │ │ │ ̄ ̄ ̄ ̄ │  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ なぜそうなるのか、ご存知の方、教えて頂ければ嬉しいです。 よろしくお願いします。
- みんなの回答 (4)
- 専門家の回答
みんなの回答
- koutarou504
- ベストアンサー率44% (182/407)
>#3:やはりこれ以上サイズを小さくするのは無理なのでしょうか。 あの~、中身がセルの指定サイズ以下であれば良くて、 中身をそのサイズ以内に収める努力をすれば良いだけですが??? 一応 #1補足にあるソースをコピーして再現してみましたが、 セルの幅30の指定に対して文字「注意!!」が既にそれ以上(推測で既に50以上)の様ですが・・・。 というか、「注意」2文字で既にオーバー。 文字サイズを小さく指定しない限り、セル幅30には治まらないでしょう・・・。 尚、#1補足にあるソースには、外部ファイルで CSS の記述があり、 これがどの様な影響をしているのかは一切不明です。 また、今回はサイズの比較は意図的に画像の物理的に存在しない IMG タグにより幅,高さを指定して表示する事によって行いました。
- koutarou504
- ベストアンサー率44% (182/407)
>なぜそうなるのか、 セル内のデータを表示する事が優先されるからですが・・・。 御自分で、データを改行しないと指定している事と、セルのサイズ指定が競合する形で指定している訳ですから、 さて、ブラウザは何を優先して描画しようとするかは・・・。 ポイントは、そもそも指定している内容が実現不可能の様で・・・。 もともと余裕があると見ている時点で間違いなのではないでしょうか? まぁ詳細はソースを公開して環境を提示しないと特定できませんが、 途中で改行が入ったという時点で、既に見えていないながら場所を取っている何かがあるのではないでしょうか?
- k0021
- ベストアンサー率26% (32/120)
>セルの横幅にはまだ余裕があるにもかかわらず、途中で改行が入ってしまいました。 セルの横幅の指定は、<COL>要素を使用して指定する width指定や文字の大きさもpxで指定すれば画面の大きさが異なってもイメージどうりに表示されますよ
- yambejp
- ベストアンサー率51% (3827/7415)
具体的なHTMLソースをしめしたほうがよろしいかと思います。 それとOS、ブラウザの種類やバージョンなど
補足
すみません、回答ありがとうございます。 文字数制限で質問では書き込めなかったため、これで分かれば上々、 必要であれば補足で書かせて頂こうと思って待っていました。 下がソース(一部)です。これで原因が分からなければ、 省略無しのものを書き込ませて頂きますので、仰って下さい。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <link rel="stylesheet" type="text/css" href="../style.css"> <title>通信</title> </head> <body><basefont size="3" face="MS ゴシック"> <hr> <table border="0" align="center"> <tr> <td colspan="2"><p>活動費申請に必要なので、皆さん何か買い物をしたら<br> 領収書を貰うようにして下さい</p><td> </tr> <tr> <td rowspan="2" width="30" style="white-space: nowrap;" valign="top"> <img src="../pic/notice.gif" width="17" height="15" alt=""> 注意!!<img src="../pic/notice.gif" width="17" height="15" alt=""> </nobr></td> <td>宛名は殿様!</td> </tr><tr> <td>日付と但し書きの指定が可能なら1月1日と鏡餅で!</td> </tr> </table> </body> ※内容は嘘 ちなみにOSはWindowsXP、ブラウザはIE6.0です。 ブラウザサイズについては、他のサイズでも確認していますが、 作成時は1024x768です。どうぞよろしくお願いします。
補足
回答ありがとうございます。 やはりこれ以上サイズを小さくするのは無理なのでしょうか。 その「見えていないながら場所をとっている何か」が知りたいのですが・・・。 ソースについては、下のyambejpさんの回答の所に 補足として載せてありますので、もしよければ見て頂けると嬉しいです。 字数制限の関係で質問に書き込めず、この形となってしまったのですが やはり分かりにくいですね;申し訳ありません。