- ベストアンサー
テーブルの横幅が絶対に変わらないようにする方法
- CSSのプログラミングでテーブルの横幅を絶対に変えない方法について教えてください。
- 文字サイズを変更してもテーブルの横幅が広がらないようにする方法を教えてください。
- スペーサーgifを使わずにテーブルの横幅を固定する方法を知りたいです。
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
その他の回答 (1)
- quads
- ベストアンサー率35% (90/257)
関連するQ&A
- テーブル幅について
どなたか教えてください。 現在、strictで、cssを用いてソースの手打ちで HPを作成しています。 文字サイズをユーザー側で変えられるように 文字をemで設定しました。 文字サイズを小→大に変更すると テーブルの中の文字が全部表示されません。 （更新ボタンを押すと正常に 全部の文字が表示されますが） この症状のときは、テーブルの横幅などをピクセル指定 していました。 テーブル幅がピクセル指定しているために 正常に表示されないのかと思い、テーブル幅などの 指定も全てem指定に変更しました。 今度は、全部の文字が表示されるのですが、 文字サイズをユーザー側で小さくすると テーブルの横幅が極端に狭くなってしまい、 最大にすると、横幅が広くなりすぎてしまいます。 理想では、横幅を固定し、文字を全て 表示させることです。 テーブルの横幅を30emに指定し、中のtdタグは 計30emになるように指定しています。 よろしくお願いいたします。
- ベストアンサー
- HTML
- divの横幅 自動調整
PHP + MySQL +html + CSS で動的テーブルを表示するサイトを制作しています。 <div id="○○○"> <table></table> </div> といったように、中のテーブルをdivで囲ってコーディングしています。 外側をdivで囲い横幅を指定してあげて、テーブルに横スクロールバーを表示させているのですが、divで指定した横幅よりもテーブルの横幅が短くなった場合、外のdivの幅がテーブルに合わせて短くならないのですが、このような場合、何か対処法はございますでしょうか。 superTable.jsを使用しており、このjsの使用がテーブルの外側にdivをおき、cssを使ってdiv側にスクロールバーを表示される仕様になっております。 以上、よろしくお願い致します。
- ベストアンサー
- CSS
- HTMLで横幅をCSSで設定できません。
HTMLで横幅をCSSで設定できません。 headerを作成しているのですが、画像のように横幅が外枠の wrapperをはみ出して表示されてしまいます。 はみ出した値は5pxとpaddingで指定した値と一致します。 headerをtableタグで作成した場合、横幅700pxの枠中での padding-left:5px;になり、横幅には変化はありません。 しかし、<div id="header">で横幅を700pxとし、 padding-left:5px;とすると、headerの横幅が 5px増えてしまいます。 <div id="header">の横幅を変化させずに、 paddingを指定することは可能なのでしょうか。 わかる方いらっしゃいましたら宜しくお願い致します。 ■HTML <html> <body> <div id="wrapper"> <div id="header"></div> </div> </body> </html> ■CSS #wrapper { width: 700px; } #header { width: 700px; padding-left: 5px; }
- ベストアンサー
- HTML
- table の横幅を指定しても長文を入れると崩れる
今フォームを作っていて、テーブルでレイアウトしているのですが、 長文を挿入すると、その文字の分だけ横幅が伸びます。つまり長文が自動で改行されないのです。ちなみにテーブルと各tdには横幅を指定してあります。 テーブルに「table-layout: fixed;」を指定すると、テーブル自体の横幅は指定通りになるのですが、中身の文章ははみ出したままです。。。 もうお手上状態です。。。 どなたかお分かりの方お教えください！！！！！
- ベストアンサー
- HTML
- ＩＥでテーブル内のテキストが勝手に改行されます。
個人でサイトを運営しているのですが、 外部ＣＳＳをテーブルに適用するとＩＥとＦｉｒｅｆoxで表示が変わってしまい 困っています。問題は下記です。 テーブルに指定するＣＳＳは以下のようなものです。 table.1{ border-top:1px solid #666666 ; border-left:1px solid #666666 ; border-collapse:collapse; border-spacing:0; background-color:#ffffff; empty-cells:show; text-align:left; font-size: 10pt; padding:3px; } .1 th{ border-right:1px solid #666666 ; border-bottom:1px solid #666666 ; color:#330000; background-color:#996633; padding:0.1em 0.1em; text-align:center; } .1 td{ border-right:1px solid #666666 ; border-bottom:1px solid #666666 ; padding:8px 8px 8px 8px; line-height: 120%; } そして本文のＨＴＭＬです。 <table width="166" border="0" class="1"> <tr> <td colspan="2"><div align="center">テキストテキスト</div></td> </tr> <tr> <td>イメージ写真</td> <td>イメージ写真</td> </tr> <tr> <td width="76"><p>テキストテキストテキストテキストテキストテキストテキストテキスト</p></td> <td width="79"><p>テキストテキストテキストテキストテキストテキストテキストテキスト</p></td> </tr> </table> 以上のようなものです。 このようにするとＦｉｒｅｆｏｘではきちんと表示されるのですが、 ＩＥだとテキストの部分が４文字ほどで勝手に改行されてしまい、 かなり縦長のテーブルになってしまいます。 試行錯誤してみたのですが、全然できなくて本当に困っています。 もし解決策をご存知の方おられましたら、ぜひ教えていただければ幸いです。
- ベストアンサー
- HTML
- TABLE内の、文字の大きさの設定
スタイルシートで文字の大きさを指定しているのですが、 こんなの↓ body {font-size:10pt;} table {font-size:10pt;} td {font-size:10pt;} th {font-size:10pt;} まず、テーブル内もBODY内も指定どおりに文字の大きさは変わるのですが、 このあと、ブラウザの文字の大きさを、 最小、小、中、大、最大と変化させても、 BODY内は正しく変わりますが、 テーブル内は全く変化無しです。 ＩＥでのみ検査してますが、 テーブルについても、BODY内と同じように、 文字の大きさが可変になるような設定方法を知りませんか？
- 締切済み
- HTML
- テーブル内の文字が揃わない
検索したのですが、見当たらないので質問させてください。 私は、ほとんど無知でコピペやテンプレを利用させてもらってホームページを作っている初心者です。 テーブルの中の文字が下のテーブルの文字の位置と合わなくて困っております。 cssは外部から呼び出しで、 ------- .t{ font-size:15px; color:#666; margin:1px 8px; text-align:right; } .t:first-letter{color:#e68080;} .text2{ line-height:18px; margin:2px 0px 20px 0px; border:1pt dotted; padding:8px 2px 8px 2px; color:#e69999; } ------ htmlは ------ <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="content-style-type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <link rel="stylesheet" type="text/css" href="left.css"> <title>diary</title> <base target="main"> </head> <body> <div class="t">blog1</div> <div class="text2"><a href="http://■.jp">日記1</a></div> <div class="t">blog2</div> <div class="text2"><a href="http://●/">日記2</a></div> <div class="t">diary</div> <div class="text2"><a href="http://▲">日記3</a></div> </body> </html> ----- と記述しています。 この日記2と日記3の文字の開始位置はマージンで指定した左で揃っているのですが、 日記1が下の２つよりもっと左に表示されてしまいます。 別のページではテーブル内をテキストではなく、画像で使用しているのですが、 同じく１つ目のテーブルの中の画像だけが左に寄り過ぎており、 加えて別のテーブルではスペースが余計に空いていて、最初のオンマウスで位置が詰まります。（画像が動きます） テーブルを消してみたりしたのですが、文字位置は変わらないので原因はテーブルではないと思うのですが… どこをいじったら解消されるのかがわかりません。 説明が下手でわかりにくいかと思いますが、どなたかご回答宜しくお願いいたします。 記述しているソースがお門違いでしたら、貼り付けなおします。
- ベストアンサー
- HTML
- テーブルにスタイルシートをかけているのですが、問題があります。
テーブルにＣＳＳをかけておりまして、 内容は外部ファイルに table.ta, td.ta, th.ta { border: 1px #3399ff solid;padding:0.5em; line-height: 150%;font-size: 9pt; margin-left:auto; margin-right:auto;} と記述しております。 そして、テーブルのボーダーを０にして、 ブラウザ上では１本の線の枠で表示されています。 しかしこれだと列が２列以上になったときに、 となりの列との境目の線が消えてしまいます。 この境目の線を表示させたいのですが、 どのような記述がありますでしょうか？
- ベストアンサー
- HTML
- htmlのtableレイアウトについて
こんばんは。訳あってｃｓｓとテーブルの両方のレイアウト手法を用いた サイト作りをしています。準初心者です。 昔から受け継がれてきたサークルのサイトの更新担当をしているのですが、 テーブルレイアウトとcssレイアウトがごちゃまぜで、わけの分からないスペーサーｇｉｆなど も多用されていたりと、悲惨な有様なので、必死に修復しているところです。 テーブルレイアウトとで組まれていても、今回は抜本的な対策は留保するつもりで書いていた のですが、ある問題に突き当たりました。 divタグ内のtableタグによって作られた1×1の表ボックスが更新情報欄になっていて、 ページの左端に隙間無くくっついているようなレイアウトにしようと試みました。 <TABLE style=" border:0px;padding:0px;margin:0px;・・とするとｄｉｖのブロック要素と テーブルが完全にくっついた状態にできると思い実践してみたのですが、どうしても何ｐｘかの隙間が生じてしまうのです。試行錯誤の末、もとのソースコードではｔａｂｌｅ要素にｈｔｍｌでwidth="400" と指定されていたものをｔａｂｌｅタグ内に <TABLE style=" border:0px;padding:0px;margin:0px; ｗｉｄｔｈ:400px;> と指定し直した結果、計らずしもこの隙間は無くなりました。 そこで疑問なのですが、なぜこのような結果になったのでしょうか、ご教授ください！
- 締切済み
- CSS
- borderが1のテーブル
ボーダーが1ピクセルくらいの表を作りたいので、tableの入れ子で作ったのですが「tableの入れ子は良くない」ととあるサイトで読んだので、入れ子にしないでtableを作りたいのですが何か良い方法はありますでしょうか？ 私が書いたのはこんなかんじです。 <table width="400" border="0" cellpadding="0" cellspacing="0"> <tr> <td bgcolor="#000000"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="1"> <tr bgcolor="#999999"> <th><div align="center"><font size="2">名称</font></div></th> <th><div align="center"><font size="2">模型材質</font></div></th> <th><div align="center"><font size="2">生産材質</font></div></th> </tr> <tr bgcolor="#FFFFFF"> <td bgcolor="#999999"><div align="center"><font size="2">本体</font></div></td> <td><div align="center"><font size="2">発泡塩ビ板</font></div></td> <td><div align="center"><font size="2">プラスチック</font></div></td> </tr> </table></td> </tr> </table> CSSで「style="border-width :1px 1px 1px 1px;border-style : solid solid solid solid ;border-color :#000000 #000000 #000000 #000000 ;"」というのを入れてやってみたのですが、これだと外側にしかラインが表示されませんでした。 よろしくおねがいします。
- ベストアンサー
- その他（プログラミング・開発）
