- ベストアンサー
tdタグに何も入れなくとも幅を均一にする方法
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
以下のようにして幅を均一にします。 tableが複数ある場合idを使ってcssの対象を特定します。 <html> <head> <style> td,th { width:100px } </style> </head> <body> <table border="1"> <tr> <th>hoge</th> <td></td> </tr> </table> </body> </html>
その他の回答 (1)
- modern5000
- ベストアンサー率46% (13/28)
ご質問の点と違うかもしれませんが、空白の代わりに文字実態参照の を使用するとセルが綺麗に表示されますよ。 <table border = "1"> <tr> <th>hoge</th> <td> </td> </tr> </table>
お礼
回答ありがとうございます。 質問文はあくまで簡単に示した例でして、 諸事情により半角スペースはおけないのですよ。 ありがとうございました。
関連するQ&A
- ●○■□などの文字を含んだ<td>の幅指定について
Firefoxで表示確認をしています。 <table border="1" width="100"> <tr> <td>あああああああああああ</td> </tr> </table> だと、幅100pxの位置で自動的に改行されるのですが、 <table border="1" width="100"> <tr> <td>●●●●●●●●●●●</td> </tr> </table> だと改行ず、幅がオーバーしてしまいます。●以外にも○■□などでも同じでした。 ●を使いつつ、指定した幅で改行させることはできないでしょうか？
- 締切済み
- HTML
- 外部スタイルシートを使ってテーブルの幅を固定する方法について（アルファベットの解除？）
テーブルで幅を固定した場合に、アルファベットの文字を続けて入れると、 それが改行されず、横に終わるまで続き、結果、固定した幅を無視した 状態で表示されてしまいます。 たとえば「aaaaaaaaaaaaaaaa」とう文字を入れた場合でも、 幅が固定されていれば自動的に aaa aaa aaa aaa aaa と改行される方法はないでしょうか？ どんな状況でも幅を固定にしたいと思っています。 <table id="tukuttemitayo"> <tr> <th>aa</th> <th>bb</th> <th>dd</th> <th>ee</th> <th>ee</th> <th>gg</th> <th>we</th> <th>sdfsd</th> <th>3ew</th> <th>asf</th> <th>saf</th> </tr> <tr> <td>36</td> <td>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaasaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</td> <td>有り</td> <td>無し</td> <td>neko</td> <td>ham</td> <td>表示中</td> <td>ささ</td> <td>ささ</td> <td>ささ</td> <td>ささ</td> </tr> <tr> <td>87</td> <td>こんちわ</td> <td>有り</td> <td>無し</td> <td>2008-03-13 14:33:22</td> <td>sd</td> <td>sfd</td> <td>sfd</td> <td>sdf</td> <td>sdf</td> <td>df</td> </tr> </table> #tukuttemitayo{ border-collapse:collapse; width:330px; background:red; border:none; } #tukuttemitayo th { width:30px; border:solid 3px #00FF66; background:yellow; } #tukuttemitayo td { background:pink; width:30px; } あと、すごく初歩的な事かもしれませんが、 tableに設定するwidthの幅はthやtdのborderの幅も含めて計算しなくてはならないのでしょうか？ <table> <tr> <th></th><td></td> </tr> <tr> <th></th><td></td> </tr> </table> table { width:104px } ←borderがあるので100ではなく104にする? tr {width:50px border:1px } td {width:50px border:1px} どんな条件でもテーブルで固定される幅を作りたいです。 よろしくお願いします。
- ベストアンサー
- HTML
- ＣＳＳについて 初心者です。
勉強中の身なんですが・・ このように設定した場合文章１と文章２が大きく開く状態になるんですが、なぜでしょうか？ また文章１セルの真ん中に表示され文章２が左にひょうじされるのも分りません・・・・ いろいろ調べてみたんですが中々納得ができなくて・・・ 特にこうういう風にやりたいとかは特になくて、なんでこうなるのかが知りたいのです。 詳しい方説明して頂けるとありがたいです。すみませんがよろしくお願い致しますｍ（。。）ｍ 「ＨＴＭＬ」 <table> <tr> <th>見出し</th> <th></th> <th> </th> <th> </th> </tr> <tr> <td>内容</td> <td> </td> <td> </td> <td></td> </tr> </table> 「ＣＳＳ］ table{ width:250px; border-collapse:collapse; border-width:1px; border-style:solid; border-color:#000000; border-spacing:0; } th{ border-width:1px; border-style:solid; border-color:#000000; } td{ border-width:1px; border-style:solid; }
- ベストアンサー
- HTML
- 固定幅div内のテーブルセルの幅指定方法
幅を指定して横スクロールバーを有効にしたdivがあります。 その中に、divよりも幅の広いtableを置き、thやtdの幅を指定したいのですが、有効になりません。 tableへの幅指定は有効になるのですが、内容が動的に変化するので、セル単位で幅を指定したいと思っています。 解決方法がありましたらお願いいたします。 HTML：標準モード UA：Windows xp IE6 サンプルコード： <style> div{ height:200px; width:200px; overflow-x:scroll; border:#f99 solid 1px; } table{ background:#ddd; border:#666 solid 1px; } td{ width:100px; border:#666 solid 1px; } </style> <div> <table> <tr> <td>サンプルテキスト</td> <td>サンプルテキスト</td> <td>サンプルテキスト</td> <td>サンプルテキスト</td> <td>サンプルテキスト</td> <td>サンプルテキスト</td> </tr> </table> </div>
- ベストアンサー
- 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
- TABLEタグの幅指定
テーブルの幅を厳密に指定したいのですが、 例えば以下のような１行２列のテーブルがあるとき、 <TABLE CELLSPACING=1 CELLPADDING=4 BORDER=0> <TR> <TD WIDTH=100>***</TD> <TD WIDTH=100>***</TD> </TR> </TABLE> このような場合にテーブルタグにWIDTH属性を加えるとすると、 100*2+4*4+1*3=219で、WIDTH=219が正確な値なのでしょうか？ よろしくお願いします。
- 締切済み
- HTML
- table 幅指定でtheadとtbodyがずれる
bootstrapを使っているのですが、 個別に幅設定がしたいので、htmlに下記を追加しました。 theadは問題なく幅設定できているのですが、tbodyがうまく適用されていないようで theadとずれてしまいます。 theadとtbodyの幅を合わせるにはどのようにすれば良いでしょうか？ <style type="text/css"> .scroll1 { width: 1600px; table-layout: fixed; } .scroll1 thead, .scroll1 tbody { float: left; } .scroll1 tbody { height: 350px; overflow-y: scroll; } .c1 { table-layout: fixed;width: 200px; } .c2 { table-layout: fixed;width: 100px; } .c3 { table-layout: fixed;width: 100px; } .c4 { table-layout: fixed;width: 200px; } .c5 { table-layout: fixed;width: 200px; } .c6 { table-layout: fixed;width: 200px; } .c7 { table-layout: fixed;width: 100px; } .c8 { table-layout: fixed;width: 250px; } .c9 { table-layout: fixed;width: 250px; } </style> <table class="table table-bordered table-striped"> <tr> <td> <table border="0" class="table table-bordered table-hover table-striped table-hgroup scroll1"> <thead> <tr style=""> <th class="c1">アクション</th> <th class="c2">店舗コード</th> <th class="c3">ユーザID</th> <th class="c4">ユーザパスワード</th> <th class="c5">ユーザ名</th> <th class="c6">メールアドレス</th> <th class="c7">管理権限</th> <th class="c8">更新日</th> <th class="c9">登録日</th> </tr> </thead> <tbody> <tr style=""> <td style="width:200px;table-layout:fixed"> <input type="submit" value="削除" /> <input type="submit" value="編集" /> </td> <td style="width:100px;table-layout:fixed"> <span >2697</span> </td> <td style="width:100px;table-layout:fixed"> <span >002</span> </td> <td style="width:200px;table-layout:fixed"> <span >000000</span> </td> <td style="width:200px;table-layout:fixed"> <span >大築</span> </td> <td style="width:100px;table-layout:fixed"> <span ></span> </td> <td style="width:100px;table-layout:fixed"> <span >0</span> </td> <td style="width:250px;table-layout:fixed"> <span >2014/11/08 21:20:39</span> </td> <td style="width:250px;table-layout:fixed"> <span >2014/11/08 21:20:48</span> </td> </tr> </tbody> </table> </td> </tr> </table>
- ベストアンサー
- CSS
- tableタグでtdタグ間が離れてしまいます
<div align="center"> <table class="serch" cellpadding="0" cellspacing="0"> <tr> <td><input type="text" name="serch" size="50"></td> <td><input type="image" value="" src="image/serch.gif" ALT="検索" serchim"></td> </tr> </table> </div> .serch{ border-style: solid; border-width: 1px; width: 100%; background-color: #F3F3F3; text-align:center; height: 30px } input textとinput image タグの間が離れてしまいます。通常連続して表示されると思うのですが 何故離れてしまうのでしょうか？
- ベストアンサー
- HTML
- 一気に「テーブルの2列目のtdタグを右詰にする
<html> <head> <title>test</title> </head> <body> <table border=1> <tr><th>No</th><th>aaaaaaa</th></tr> <tr><td>1</td><td>bbb</td></tr> <tr><td>2</td><td>ccc</td></tr> </table> </body> </html> このようなテーブルで 右側の2列目のtdタグを右詰にしたいのですが、 一気に「テーブルの2列目のtdタグを右詰にする」と言う方法は有りますか? 今は <html> <head> <title>test</title> <style type="text/css"> td.example1 { text-align: right; } </style> </head> <body> <table border=1> <tr><th>No</th><th>aaaaaaa</th></tr> <tr><td>1</td><td class="example1">bbb</td></tr> <tr><td>2</td><td class="example1">ccc</td></tr> </table> </body> </html> このようにしていますが 一つ一つタグを付けるのは非効率的と思っています。
- ベストアンサー
- HTML
- ラインはtableタグを使って書くのでしょうか？
<table border="0" width="100%" style="bordr-left:0px;border-right:0px;border-top:thick ridge;border-bottom:0px"> <tr><td width =100%></td></tr></table> ｈｔｍｌを勉強中でソースをのぞいてみるのですが、テーブルのデーターなしで幅が０とか？？でわかりません。なぜラインになるのでしょうか？＜ｈｒ＞とかとはちがうのでしょうか？？おおしえください
- 締切済み
- その他（インターネット・Webサービス）
お礼
回答ありがとうございます。 そうか、tdタグにwidthをおけばいいんですね。 tableタグにおいてましたorz ありがとうございました。