- ベストアンサー
テーブル幅が固定できない
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
table-layout:fixed;と一緒にwidthを指定されましたか？ 両方設定しないと固定されません。
その他の回答 (1)
- ORUKA1951
- ベストアンサー率45% (5062/11036)
fixedの意味を取り違えている？ tableは本来、すべての行について内容を算出してレイアウトしていくのですが、fixedが指定してあると一行目から描画を始めます。 単にそれだけです。 ⇒17.5.2 表の幅を計算する（Table width algorithms: the 'table-layout' property）( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/tables.html#width-layout ) 実際の計算方法は上記を参考に・・ なお、tableは決してレイアウトには使ってはなりませんから、ユーザビリティを考えるとtable-lyoutの値はautoが望ましいです。描画を早くするためにセルの最大文字数に合わせて、width:5emとかを一行目のセルに指定すると良いでしょう。
補足
fixedが幅固定できないということは width:5emを使えばよいということでしょうか？
関連するQ&A
- テーブルの幅固定について
テーブルの幅固定を以下のように行っているのですが文字が指定した幅を超えると、 幅を指定してるにも関わらず、文字が改行せずに幅が伸びてしまいます。 自動的に改行になるとばかり思っていました。 <br>での改行は考えていないので、テーブルの幅を絶対的に固定する方法ありますでしょうか？ <table width="50" border="0" style="background-color: #cecece"> <tbody> <tr> <td>AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA</td> </tr> </tbody> </table>
- ベストアンサー
- HTML
- テーブルの幅を固定するとnowrapがきかなくなるのですが・・・
いつもお世話になっております。どなたか教えて下さい。 テーブルの幅を”width=***”で固定しました（tableタグもｔｄタグも両方）。文字列を改行したくないので”nowrap”を書いて改行不可にしたら、改行は回避できたものの、幅が固定されずに文字の長さに合わせられてしまいました。 そこでこのサイト内で方法を模索していると”style=table-layout:fixed”で固定できると書いていたので追加すると幅の固定は出来たのですが、今度は文字列が改行されてしまいました。 どうすれば幅を固定し、改行も回避できるのでしょうか？ 文字列が長すぎるものは途切れていてもＯＫなので、枠をとにかく固定したいのです。 どなたか回答御願い致します。 ブラウザはIE５か６です。
- 締切済み
- HTML
- テーブルの幅をデフォルトに戻すcssがわかりま
<html> <head> <title>test</title> <style type="text/css"> table { width: 100%; } </style> </head> <body> <table border=1> <tr><td>No</td><td>table1</td></tr> </table> <table border=1> <tr><td>No</td><td>table2</td></tr> </table> </body> </html> このようなソースで二つ目のテーブルだけ table { width: 100%; } を適用しない方法はありますか? 実際はテーブルが複数あり 基本的には table { width: 100%; } をテーブルに設定したいのですが とあるテーブルのみテーブルの幅をデフォルトのサイズにしたいのです。 table { width: 100%; } で全てのテーブルに適用した後に クラスを使って該当のテーブルのみ デフォルトの値に戻す方法は有りますか? <table border=1 class="デフォルトに戻す"> <tr><td>No</td><td>table2</td></tr> </table> としたいのですが テーブルの幅をデフォルトに戻すcssがわかりません。 2つのテーブルの幅は指定したくありません。
- ベストアンサー
- 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 幅指定で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
- テーブルの設幅固定がオフラインで崩れます
WEBサイトでテーブルのセル幅を固定しているのですが、オンライン環境では意図通りになるものの、オフライン環境では固定されずに崩れてしまいます。 固定方法は、外部CSSで「table-layout:fixed;」と「各セルのwidth指定(class)」を記述しています（下記ご参照下さい）。 外部CSSへのリンク指定は絶対パスではなく相対パスで指定しており、オフライン環境でもCSSの参照は出来ていると思います（セル幅以外の記述内容は反映されます）。 どこに原因があるのか分からずに困っています。 お分かりになる方がおられましたら、ご教示頂きたくお願い申し上げます。 【CSS】 table.t { border:1px solid #000000; border-collapse:collapse; table-layout:fixed; font-size:13px; } table.t td{ border:1px solid #000000; height:13px; } table.t th{ border:1px solid #000000; font-size:13px; } .index{ width:155px; } .remarks{ width:100px; } .code{ width:120px; } ・ ・ ・ 【HTML】 <table class="t"> <thead> <tr> <th class="index">INDEX No.</th> <th class="remarks">Remarks</th> <th class="code">Part code</th> ・ ・ ・
- ベストアンサー
- CSS
- テーブル<TD>の幅の固定
テーブルのTD幅をWIDTHで指定しているのですが、入力するテキストによって幅が動いてしまいます。 例） <table width="50"> <tr> <td width="10">AAAAAAAAAAAAAAAA</td> <td width="40">AA</td> </tr> </table> というような場合、幅の狭い方のセル幅が広くなってしまいます。 また逆に広い方が何度も改行させられて出力されたり、出力させたいテキストによって、いかようにも幅が変更されてしまいます。 他のサイトなども色々調べてみて、半角英数字の場合は特に顕著ということも書かれてあったのですが、半角英数字の出力は必須なんです。 （全角文字の場合でも、完全に固定とはなりませんでした） やっぱり完全にテーブルのセル幅を固定するのはムリなのでしょうか？ 何か解決方法はありますでしょうか？ よろしくお願いします。
- ベストアンサー
- HTML
- table の幅を固定したい
初心者です。教えて頂けますか？ テーブル内に、php pear mdb2 を利用して文字列を入れているのですが、 文字列が長いのですが、シングルバイト文字とマルチバイト文字で挙動が異なっています。 指定している幅で固定したいのですが どうすれば良いでしょうか？ 申し訳ありません。よろしくおねがいします。 <table width="380" border="1" cellspacing="0" cellpadding="0"> <tr> <td> あいうえお。あいうえお。あいうえお。あいうえお。あいうえお。あいうえお。あいうえお。あいうえお。あいうえお。あいうえお。... </td> </tr> </table> <table width="380" border="1" cellspacing="0" cellpadding="0"> <tr> <td> yyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy... </td> </tr> </table>
- ベストアンサー
- HTML
- テーブルの幅 余白をなくすことは可能ですか？
<html> <head> <title>test</title> </head> <style type="text/css"> table { width: 100%; } </style> <body> <table border=1> <tr><th>a</th><th>b</th></tr> <tr><td>1</td><td>2</td></tr> </table> </body> </html> のように テーブルの幅を１００％にしても 両端に余白が出来てしまいますが この余白をなくすことは可能ですか？ 添付画像はIEで表示させた状態ですが ファイアフォックスなど他のブラウザで表示させても余白が出来ます。
- ベストアンサー
- HTML
- table 幅固定で、端までいったら自動折り返し タグ
クリックありがとうございます、また質問させて頂きます。 今メモ帳でホームページを作成中です。 素人質問かもしれませんが、お力貸して下さると助かります。 小説ページを作成しているのですが、その中でTABLEを幅固定して自動折り返しさせる方法がわかりません。 色々なサイト様を巡らせて頂き、 <table width="750" cellpadding="20" border="0" style="table-layout:fixed;"> ↑こういうタグを打った所（勿論最後に</table>とかつきます）、幅は固定されるものの、width=750の大きさのラインで文字が折り返されず途切れてしまいました。 （メモ帳には「テストテストテストテスト」と打っていても、ページを開くと「テストテストテス」で文章が終了してたりする、ということです。） また、table width="数字"や、パーセンテージで設定すると幅自体が固定されません。 検索で、半角英数字の連打（例：aaaa）は普通の設定だと折り返しされないと知ったため、「テストテストテスト」などの単語を連続して試しています。 最終手段の、<br>使用はなるべく控えたいと思っています。 上手く固定出来るタグを教えて頂けると嬉しいです。 宜しくお願いします。
- 締切済み
- HTML
お礼
返答遅れて申し訳ありません。 widthを指定しましたが変わり無しでした。 ですが、さらに外側のタグにwidth等を指定すると固定することができました。 なぜ、固定できるようになったかが、いまいち分かりませんが 解決できたため締め切らせていただきます。