- ベストアンサー
同じwidth=200でもセル内の文字によって幅が違う
coursegtの回答
- coursegt
- ベストアンサー率33% (1/3)
<table width="580">、<th width="60">、<th width="200">とありますが 数値の後にpxをつけてはどうでしょうか？ ex) <th width="580px">
関連するQ&A
- widthを指定しない<td>が幅をシェアする基準？
<table>タグの表示不安定につき、ご教示ください。 aaaa.txtに蓄積したデータをCGIで切り分けて、下記の<table>タグ内に割り付けて 表示させています。 <table width=510> <tr><th>左列の表題</th> <th>右列の表題</th></tr> <tr><td>改行タグを含む文字列Ａ１</td> <td>改行タグを含む文字列Ｂ１</td></tr> <tr><td>同様のＡ２</td><td>同様のＢ２</td></tr> <tr><td>同様のＡ３</td><td>同様のＢ３</td></tr> <!--このtrを繰返し--> </table> 表幅を絶対指定したのは、印刷時に 510 px ／ 72 dpi ＊ 2.54 cm ＝ 18 cmで、 Ａ４の幅に納まりやすいだろうという意図です。文字列ＡとＢは、それぞれ <br>で区切ってありますが、区切りは概ね１行分（はみだせば折り返し）です。 <td>の幅を指定しなかったのは、<br>までの長さに応じて表示幅をシェアさせ、 折り返し頻度を減らすこと（印刷時の縦長の節約）が目的です。 IE5／Win&Mac及びNN4.7／Win&Macで、td内の１行長を無視した割付けが しばしば生じ、その割付け方の法則がわかりません。小細工を諦めて、列幅を 50％ずつに指定してしまおうかとも思っていますが、ブラウザは何を基準に 列幅を割り付けているのでしょう？ 要領を得ない状況説明で恐縮ですが、追加説明は補足要求でご指示ください。
- 締切済み
- HTML
- TABLE内でのwidth指定
<table> <tr><th colspan="3">●</th></tr> <tr><td class="1">■</td> <td class="2">▲</td> <td class="3">★</td></tr> <tr><th colspan="3">○</th></tr> <tr><td class="1">□</td> <td class="2">△</td> <td class="3">☆</td></tr> </table> このサンプルについて考えています。 ●○が、割と長い文字列になります。 この時、例えば2段目の左の列が、■,□のうち長い方の文字列に合わせて「width」が表示されるためには、スタイル「class="1"」の内容をどう記述すれば良いのでしょうか。 デフォルトの「width:auto」では、●○の長さに引っ張られてしまい、余分なスペースが出来てしまいます。 2段目の中の列（▲△部分）が短文を記述するセルなので、●○に合わせる必要のあるスペースは、全てここで吸収してしまいたいのです。 同じ仕組みで幾つかテーブルを組みますので、【class="1"】のwidthにpx,%等といった値自体を指定するのは向いていません。 ご指導おねがいします。
- ベストアンサー
- HTML
- htmlのセル幅固定の仕方
お世話になります。 htmlの表のセル幅は、どのように決まるのでしょうか。 THのwidth="○"を使っても、表示させるデータによって 幅が変化しているような気がします。 これは、私の記述の仕方が悪いのか、もしくは、width="○"では固定できないのか教えてください。 ●例 <TABLE border="1" width="150" > <TH width="50">a</TH> <TH width="100">b</TH> <td>○○○</td> <td>ＸＸＸＸＸ</td> </TABLE>
- 締切済み
- HTML
- テーブルwidthで指定したのに幅が広がる
↓のようなHTMLをCGIで出力しました。 <TABLE width="500" cellpadding="10" bgcolor="wheat"> <TR> <TD>2006年9月6日（水）20時48分 </TD><TD><B>2/12求人広告結果</B></TD><TD> 広告</TD> </TR><TR><TD colspan="3">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa </TD></TR> <TR><TD colspan="3"><A HREF="./outsider01.cgi?mycmd=edit&view_page=328"><P align="right">編集</A>｜<A HREF="./outsider01.cgi?mycmd=delete&view_page=328">削除</A></P></TD></TR> </TABLE> すると、テーブルの幅が広がるのです。 aaaaaaaaaaaaaaaaaaaa・・・ ではなく、ふつうの全角の文章ですとwidth500で固定されるようです。 なぜ小文字のaaaaaaaaaaaaaだとwidthが固定されないのでしょうか？
- ベストアンサー
- HTML
- テーブルの幅
tableのwidth指定についての質問です。 同じレイアウトで複数のhtmlファイルを作るのですが、その中のテーブル及びセルの幅をwidthで固定してあるのにも関わらず、セル内のテキストの長さによって各ファイルごとのテーブルのセルの幅が、IEでの表示で変わってしまいます。 <table width="450" cellspacing="0" cellpadding="2" border="1"> <tr> <th bgcolor="#ffcccc" width="150">aaaaaaaaa</th> <th bgcolor="#ffcccc" width="286">\100,000</th> </tr> <tr> <td colspan="2">ここには商品説明が入ります。ああああああああああああああああああああああああああああああああああああ</td> </tr> </table> 上記のaaaaaaaaaの部分がファイルによって長さが違うのですが、それによってセルの幅が変わってしまいます。 IE６でプレビューすると変わりますが、firefoxでは変わりません。 <th>を<td>に変更すると、幅は固定され変わりません。 IEの場合、thでwidth指定が出来ないのでしょうか。 なぜ変わってしまうのでしょうか?どこかに記述の問題があれば教えていただければありがたく思います。
- 締切済み
- HTML
- 次のテーブルのセル内文字を小さく
したいのですがセル内文字ごとに<h7></h7>を付けると文字は小さくなるもののセルの高さがむしろ高くなり文字が上に貼りついてしまいます セルの高さも同じように文字にあわせて小さくできるような設定はあるでしょうか? <table border=1 cellspacing=0 cellpadding=0> <caption align=left> <nobr>あいうえおかきくけこ<nobr/> </caption> <tr><td colspan=3>abc</td></tr> <tr><td>A</td><td>B</td><td>C</td></tr> <tr><td>A</td><td>B</td><td>C</td></tr> <tr><td>A</td><td>B</td><td>C</td></tr> <tr><td colspan=3 height=15></td></tr> </table>
- ベストアンサー
- HTML
- セルの幅について
htmlで指定した幅と開発者ツールで確認した実際の幅、JQUERYで取得できる幅 それぞれ違うのはなぜでしょうか。 具体的なｈｔｍｌは以下のようなものです。 table-layout: fixedは都合により使う事ができません。 <script src="./jquery.js" type="text/javascript"></script> <table border="1"> <colgroup> <col width="10"> <col width="20"> <col width="30"> </colgroup> <thead> </thead> <tbody> <tr> <td class="a">a</td> <td class="b">b</td> <td class="c">c</td> </tr> </tbody> </table> <script type="text/javascript"> alert($('.a').width()); </script> 開発者ツールで確認すると左から14 24 34の幅になります。 また、jqueryでセルの幅をwidth()で取得すると 12 22 32となります。 指定 使用しているブラウザはIE8 / IE6です。
- 締切済み
- HTML
- 2つのテーブルの幅を一致させたい
以下のHTMLで、2つのテーブルのセル幅が一致しません。 JavaScriptではヘッダのセル幅をボディのセル幅に合わせています。 ボディ部分の文字列をすべて日本語にするとうまくいくのですが・・・ JavaScriptというよりはHtmlの問題な気がしますが、よろしくお願いします。 jqueryを使用しています。 <html> <head> <script src="js/jquery.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function () { headerTableWidthFit(); }); $( window ).resize(function(){ headerTableWidthFit(); }); function headerTableWidthFit() { var i = 0; $('#resultBodyTable table tbody tr:eq(0) td').each(function() { $('#resultHeaderTable table th').eq(i).width($(this).width()); i++; }); } </script> </head> <body> <div id="container"> <div id="resultHeaderTable" class="headerTable"> <table border="1" cellspacing="0" cellpadding="0"> <thead> <tr> <th>あ</th> <th>い</th> <th>う</th> <th>え</th> <th>お</th> <th>か</th> <th>き</th> <th>く</th> </tr> </thead> </table> </div> <div id="resultBodyTable" class="bodyTable"> <table border="1" cellspacing="0" cellpadding="0" width="100%"> <thead> </thead> <tbody> <tr> <td>あaaaaaa</td> <td>い</td> <td>う</td> <td>え</td> <td>お</td> <td>か</td> <td>き</td> <td>く</td> </tr> </tbody> </table> </div> </div> </body> </html>
- ベストアンサー
- JavaScript
- テーブルを壊さない方法を
知れたいのですが教えてください <table> <tr><th>a</th><th>b</th><th>c</th><th>d</th></tr> <tr><td>A</td><td>B</td><td>C</td><td>D</td></tr> </table> a,b,c,d,A,B,C,Dの部分が少し長いだけでセル内で折り返されてしまいます 折り返されない方法を教えてください
- ベストアンサー
- HTML
- tableの中にtableを作ると、width指定が機能しない
tableの中にtableを作り、中側にあるテーブルの列ごとにwidthを指定したいのですが、うまくいきません。ソースを書いてみます。 例： <table width=300> <tr><td> <table width=100> <tr><td>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</td><tr> </table> </td><td> <table width=100> <tr><td>bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</td><tr> </table> </td><td> <table width=100> <tr><td>ccccccccccccccccccccccccccccccccccc</td><tr> </table> </td></tr> </table> width=300のテーブルの中にwidth=100のテーブルが3つできたのはいいのですが、width=100のテーブルの中に100pxを超える文字列を入れると100pxという値を無視してテーブルが横長くなってしまいます。 これを100pxという値に従わせるにはどうしたらいいでしょうか？
- ベストアンサー
- HTML
お礼
ご回答ありがとうございます。 pxを付けて、さらに全行全セルにwidthを設定したところ、【Ｃ列】の幅の差はほんのわずかになりました。 でも完全に同じにはなりませんでした。 さらに良い方法をご存知の方がいましたらご回答お願いします。