• ベストアンサー

<table>について教えてください。

kazumeroの回答

  • kazumero
  • ベストアンサー率40% (20/49)
回答No.1

table要素は、表を作成するためのタグなので、レイアウト目的で用いるのは不適切とされています。 レイアウト目的であれば、div要素にCSSを適用するやり方が正しいです。 レイアウトの組み方ですが、例えば段組を再現されたいのでしょうか? もしそうでしたら、参考URLのWebページが参考になると思います。 div要素にCSSを適用するやり方で段組を実装しています。

参考URL:
http://desperadoes.biz/style/dan/index.php
hamu1985
質問者

お礼

ご回答ありがとうございます。 ずっと悩んでいました。質問して正解でした。

関連するQ&A

  • <table>~</table>内のテキストのサイズ

    以下のようなソースで,TEXTの部分のサイズを変更したいと思い,<table>~</table>を含む範囲をを<div class="test">~</div>で挟んで,スタイルシートで指定してみました. そしたら,<div class="test">~</div>の中でも<table>~</table>の外にあるテキストはサイズが変わるのですが,下のソースのTEXT部分は変わりませんでした. 表中のテキストのサイズを一括して指定する方法はあるのでしょうか? <table align="center"> <tr bgcolor="#aaffaa"> <td>TEXT</td><td>TEXT</td><td>TEXT</td> </tr> <tr bgcolor="#aaaaff"> <td>TEXT</td><td>TEXT</td><td>TEXT</td> </tr> </table>

    • ベストアンサー
    • HTML
  • コンテナ内で文字を中央に表示したい

    <div> <table border=0 cellspacing=0 cellpadding=0 style="width: 100%; height: 100%;"> <tr> <td style="text-align: center; vertical-align: middle;"> Hello! </td> </tr> </table> </div> のように、テーブルを使わずに(できればCSSなどで)divタグ内のテキストを中央に表示したいのですが、できますか? よろしくお願いします。

    • ベストアンサー
    • HTML
  • スタイルシートでtable位置を指定したい

    スタイルシートでtable全体の位置をセンターへ持って行きたいのですが、調べてもテキストのalignしか出てきません。 tableそのものをセンターへ持って行くにはhtmlファイルのtableタグ内でaligh="center"とするか、スタイルシートでcenterを指定するにはtable全体をdivなどで囲んでdivの要素としてcenterを指定してやるしかないのでしょうか。 できれば<table class="xxxx">として1つにまとめたいのですが。 解決方法ご存じの方ぜひ教えてください。

    • ベストアンサー
    • HTML
  • firefox対応で表(<table>)を中央に表示したい

    インターネットエクスプローラ(IE)では表(<table>~</table>)の中央表示 をスタイルシートの style=text-align: center; で指定できたものが、 FireFoxでは通用しないようです。 tableタグにてalign=centerと指定すれば中央表示できるものの、これは非推奨であるため今後のことを考えて使用を避けたく考えております。 非推奨要素を使用せず表を中央に表示する方法はあるのでしょうか?

    • ベストアンサー
    • HTML
  • tableタグに右に回り込みの位置

    tableタグに右に回り込みを入れたのですが<table align="left"> CSSのでtable全体と回り込みをした文字を上の方に移動させたいのですが これが回り込みをした文字しか移動しなくて困っています。 <div style="position:relative; bottom:20px"> <table border=1 align="left"> <tr> <td>表の内容</td> </tr> </table> 回り込み </div> が例えなのですが、何か打開策など御座いませんか?

  • Firefoxだと無効なのかなあ…

    自分で作ったページなんですが、スタイルシートで、 div{text-align:center;} と指定してからdivタグでセンタリングしたいところをはさんでいます。 IEで見てみると文章も画像もテーブルもきれいに全部センタリングされてるのですが、Firefoxで見てみるとテーブルだけ左に寄ってしまいます。 やっぱりきちんと <table align="center"> って指定しておかないとだめでしょうか?

  • table要素のwidthの解釈

    tableタグを使って次のようなことをしたいと考えています。 ・table要素の親はdiv要素 ・div要素にはサイズ(width/height)が指定されており、overflow:hiddenとしてある。 ・table要素にはサイズを指定しない ・td要素にはサイズを指定する →つまり、tableのサイズはtdのサイズで決定する HTML/CSSは次の通りです。 ----------------------------------------------------- div { width: 300px; overflow: hidden; } table { table-layout: fixed; } td { width: 170px; } <div> <table><tr> <td>a</td><td>b</td><td>c</td> </tr></table> </div> ----------------------------------------------------- このコードを「DOCTYPE宣言を書かずに」IE8で開くと、想定通りの表示になりますが、 <!DOCTYPE html>と記述すると、tableの横幅が300pxに詰められてしまいます。 td要素のwidth指定が働かず、親のdiv要素のwidthに無理やり押し込められてしまうようです。 また、FirefoxではDOCTYPE宣言無しでも同様の問題が起きてしまいます。 table内の列数は固定ではないので、tableに対してwidth指定はしたくありません。 何か書き方が間違っているのでしょうか。 あるいは、標準準拠モードの仕様では、そもそもできないことをやろうとしているのでしょうか。

  • HTMLタグについて

    <!-- #EndEditable --> <meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> <link rel="stylesheet" href="古いデーター/text.css" type="text/css"> </HEAD> <BODY bgcolor="#FFFFFF" text="#000000" leftmargin="0" topmargin="5" marginwidth="0" marginheight="5"> <table width="760" border="0" cellspacing="0" cellpadding="0" align="center"> <tr> <td><div align="center"><img src="toppu2.gif" width="700" height="92"></div></td> </tr> </table> <div align="center"> <table width="760" border="0" cellspacing="0" cellpadding="0"> <tr> <td><div align="center"><img src="botan4.gif" width="700" height="57" border="0" usemap="#Map6"></div></td> </tr> <tr> <td><div align="left"><!-- InstanceBeginEditable name="contents" --> _________________________  上記のタグで 【<link rel="stylesheet" href="古いデーター/text.css" type="text/css"> 】が文字化けしてるから可笑しいと思うのですが、これを テンプレート上で下記のように修正してもエラーが出て 上手くいきません。 <link rel="stylesheet" href="../../text.css" type="text/css">  この他におかしい部分が多分あると思うのですが、 そこをお教えください。  宜しくお願い致します。

  • CSS段組み?で右カラムを右寄せにするには?

    説明が難しいのですが・・・ テーブルレイアウトでいえば、下記のHTMLで実現できるような表示方法を、 tableタグを使わずに実現したいです。 <table style="width: 100%;"><tr>  <td>左パーツ</td>  <td style="text-align: right;">右パーツ</td> </tr></table> divタグに float: left; を付けると、2つのdivブロックを横並びに配置できますが、 右側にあるdivにtext-align: right;を付けても、左寄せになってしまいます。 ※width未指定なので当たり前なのですが・・・ ただ、今回の場合は実際にマルチカラムを実現したいわけではなく、 上記コードでいうところの左パーツを画面の左端へ、 そして右パーツを画面の右端に表示させたいだけです。 左右それぞれの横幅は特定していません。 どなたか分かる方、教えて下さい。

    • ベストアンサー
    • CSS
  • テーブルを中央に表示させる場合

    cssでテーブルを中央に表示させる場合、 http://www.1uphp.com/con1/table/align-center.html のサイトでいうと、 1.<div>の中身をtext-align:center;で中央に表示 2.中央表示されないブラウザ(FirefoxOpera)に対してmargin-方向:auto;を設定 のどちらの方法で指定したほうがいいのでしょうか? 万人向けのサイトを作ってるのでブラウザはまちまちなのですが そのような場合のタグの書き方を教えてください。

    • ベストアンサー
    • CSS