- 締切済み
HTMLはalign=centerは機能しないの?
お世話になっております。 HTMLやXHTMLにお詳しい方、回答をお願いします。 まずは以下のソースの確認をお願いします。 tableの中にtableを入れて4つのセルの中にアルファベットが入っています。外枠のtableに<tr align="center"> を書いているので4つのアルファベットは中央揃えになります。 しかし、1行目を消すと、センタリングが機能しなくなってしまいます。 この原因はなぜでしょうか?原因が知りたいのです。1行目のドキュメント宣言は「このソースはXTMLですよ」ってことですよね? ってことはこの1行目を消したらXHTMLではなく、HTMLになるのですよね?ってことはHTMLはalign=centerは機能しないのでしょうか?ただ、<td>a</td>を<td align="center">a</td>として、1行目を消してもaはセンタリングされました。。。いったいどうなっているのでしょうか? どなたか詳しい方教えてください。1行目を消すとセンタリングにならないのはなぜですか?よろしくお願いします! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>無題ドキュメント</title> </head> <body> <table width="200" border="1"> <tr align="center"> <td><table width="200" border="1"> <tr> <td>a</td> <td>b</td> </tr> <tr> <td>c</td> <td>d</td> </tr> </table></td> </tr> </table> </body> </html>
- みんなの回答 (4)
- 専門家の回答
みんなの回答
- t_ohta
- ベストアンサー率38% (5253/13739)
IE8 で見られているのであれば、貴方の記述方法で文字がテーブルのセル内でセンタリングされているのはIE独自の機能によるものです。 今どきの記述をするのであれば、スタイルシートを使ってセル内がセンタリングされるように書く方がいいでしょう。
- ORUKA1951
- ベストアンサー率45% (5062/11036)
確かに1行目に書かれている宣言はDOCTYPEといって、以下の文書がXHTMLだと宣言してますがXHTMLだと、XMLでもあるわけですから、XML宣言も必要です。すなわち <?xml version="1.0" encoding="…"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> です。 ただ、IE8は、xml宣言がなくても、標準モードで描画しますが、DOCTYPEもなければ、互換モードで描画します。 ★互換モードとは、旧来のIE独自のインターネット標準とは異なる描画をするということです。 ★それよりも大事なこと そもそも、tableに対してそれが含まれる親のコンテナ(ここではtd)にalign=centerを記述しても、センターに来てはならないのです。 align=centerは、ブロック要素内のインライン要素に対しての配置方法であって、tableのようなブロック要素に規定すべきではありません。 それを期待すると、本来の動作でないわけですから、必ず破綻します。 ★いまだにTransitionalを使われることが理解できません。策定中のHTML5の仕様書( http://www.w3.org/TR/html5/ )を読むとわかりますが、Transitinalはブラウザはサポートしなければならないが、著者は使うべきでない仕様です。(HTML4.01の時には遠まわしに言っていたがHTML5では、ずばりそう言い切ってます) たとえばalignという属性は、非推奨です。 【引用】____________ここから align = top|bottom|left|right [CI] Deprecated.  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Tables in HTML documents( http://www.w3.org/TR/html401/struct/tables.html#adef-align-CAPTION )]より これが、表でないのにtableでマークアップされているのでしたら論外 【引用】____________ここから ページレイアウトの目的で表を用いる。  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Style Sheets in HTML documents (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/styles.html#h-14.1 )]より ですが、もしtableなら <table width="200" border="1"> <tbody> <tr> <td> <table width="200" border="1"> <tbody> <tr> <td>a</td><td>b</td> </tr> <tr> <td>c</td><td>d</td> </tr> </tbody> </table> </td> </tr> </tbody> </table> その上で、スタイルシートで、 td{text-align:center} と書くだけで、そのHTML内のすべてのtdは中央配置になります。tableはブロック要素なので中央配置されない(されるべきではない)ので td table{width:300px;margin:0 auto;} とします。tdセル内のtableは、300px幅で上下は0,左右は自動と言う意味
- yambejp
- ベストアンサー率51% (3827/7415)
内と外が同じwidthじゃセンタリングされているかどうかなんてわからないでしょ? とりあえず外側のテーブルのwidthを広げてみましょう <table width="400" border="1"> <tr align="center"> <td><table width="200" border="1"> <tr> <td>a</td> <td>b</td> </tr> <tr> <td>c</td> <td>d</td> </tr> </table></td> </tr> </table> 内側の文字をセンタリングしたいなら内側のテーブルにtbodyなど 設定するとよいかと <table width="400" border="1"> <tr align="center"> <td><table width="200" border="1"> <tbody align="center"> <tr> <td>a</td> <td>b</td> </tr> <tr> <td>c</td> <td>d</td> </tr> </tbody> </table></td> </tr> </table>
- t_ohta
- ベストアンサー率38% (5253/13739)
お使いのブラウザは何でしょう? Firefoxで見るとDOCTYPEの有無に関係なく全ての文字が左に寄ってますよ。
補足
ごめんなさい。ブラウザはIE8です!