- 締切済み
HTMLはalign=centerは機能しないの？
お世話になっております。 HTMLやXHTMLにお詳しい方、回答をお願いします。 まずは以下のソースの確認をお願いします。 tableの中にtableを入れて４つのセルの中にアルファベットが入っています。外枠のtableに<tr align="center"> を書いているので４つのアルファベットは中央揃えになります。 しかし、１行目を消すと、センタリングが機能しなくなってしまいます。 この原因はなぜでしょうか？原因が知りたいのです。１行目のドキュメント宣言は「このソースはXTMLですよ」ってことですよね？ ってことはこの１行目を消したらXHTMLではなく、HTMLになるのですよね？ってことはHTMLはalign=centerは機能しないのでしょうか？ただ、<td>a</td>を<td align="center">a</td>として、１行目を消してもaはセンタリングされました。。。いったいどうなっているのでしょうか？ どなたか詳しい方教えてください。１行目を消すとセンタリングにならないのはなぜですか？よろしくお願いします！ <!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>
- miki_miki_007
- お礼率0% (0/4)
- HTML
- 回答数4
- ありがとう数0
- みんなの回答 （4）
- 専門家の回答
みんなの回答
- t_ohta
- ベストアンサー率38% (5071/13248)
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% (5071/13248)
お使いのブラウザは何でしょう？ Firefoxで見るとDOCTYPEの有無に関係なく全ての文字が左に寄ってますよ。
関連するQ&A
- DreamWeaverで作るテーブル
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>無題ドキュメント</title> </head> <body> <table width="800" height="394" border="1" align="center"> <tr> <td> <p>1</p> <table width="200" border="1" align="left"> <tr> <td height="118">2</td> </tr> </table> <table width="600" border="1"> <tr> <td height="121">3</td> </tr> </table> <p> </p></td> </tr> </table> </body> </html> このようにテーブルを作った場合、3のセルの右のラインが1のセルの右ラインに隠れるというか見えなくなります。 そこで3のセルにalign="left"を設定するとIEではラインが見えるのですが、Netscapeでは2と3が縦に並んでしまいます。 なんとか3の右ラインを見えるようにしてNetscapeでも縦に並ばないようにするにはどうすればいいでしょう。 よろしくお願いいたします。
- ベストアンサー
- その他（インターネット・Webサービス）
- liタグ中の二つのTABLEの間を埋めたい
お世話になります。 現在二つのテーブルタグを埋めたくて、思考錯誤中です。 普通にTABLEタグを利用すると、二つのテーブルは隙間なく埋まります。 これをliタグに持っていくと、隙間が発生しております。 これを埋める方法はありませんでしょうか？ 何卒よろしくお願いします。 （ちなみに私の環境はIE6です。） <!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> <title></title> </head> <body style="background-color:Black;"> <div> <table> <tr> <td> <table style="background-color: Red;"> <tr> <td> a </td> </tr> </table> <table style="background-color: Red;"> <tr> <td> b </td> </tr> </table> </td> </tr> </table> </div> <ul> <li style="text-align: left; vertical-align: middle;"> <table style="background-color: Yellow;"> <tr> <td> a </td> </tr> </table> <table style="background-color: Yellow;"> <tr> <td> b </td> </tr> </table> </li> </ul> </body> </html>
- ベストアンサー
- HTML
- FireFox2.0でCSSを使ってテーブルそのものをセンタリングしたい
IE６だと #wrapper { text-align: center; } <div id="wrapper"> <TABLE border="1"> <tr><td>テキスト</td></tr> </table> </div> とやればテーブルそのものがセンタリングされるのですが、 FireFox2.0だと左に寄ったままです。 CSSを使わずに<center>で囲めばセンタリングされますが、 そうではなくてCSSを使ってやるやり方はないでしょうか？
- ベストアンサー
- HTML
- テーブルを上部に付けてセンタリング表示させたい
質問お願い致します。 ピクセルで幅の長さを指定したテーブルを上部に付けて センタリングしたいのですが、なぜか左に寄ってしまうのです。 いろいろな箇所にセンタリングのタグを打ち込んでも 利いてくれません。 ％指定をすると不恰好になってしまうのでどうしても ピクセル指定でセンタリングしたいのですが よろしければご指摘ください。 お願い致します。 ------------------以下ソースです---------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>Travel Guide: Ragged Point Inn</title> <style type="text/css"> body{ float: center; margin-top: 0px; color: white; background:#000000; background-attachment:fixed; } table{ float: center; width: 700px; background: #FFFFFF; color: #000000; } </style> </head> <body> <table cellspacing="0"> <tr> <td id="content"> <table cellspacing="0" align="center"> <tr> <td>aaaaa</td> </tr> </table> </td> </tr> </table> </body> </html>
- ベストアンサー
- CSS
- テーブル内に２つのテーブルを作成した場合の位置の固定
ＨＴＭＬでテーブルの中に２つのテーブルを作成しました。 簡単に書くと以下のような感じです。 <table border="1"> <tr> <td align="center" valign="top"> <table border="1"> <tr> <td>hogehoge</td> </tr> </table> <br> <br> <table border="1"> <tr> <td>mogomogo</td> </tr> </table> </td> </tr> </teble> テーブル内の一つ目のテーブルをテーブルの上部に、もうひとつのテーブルをテーブル内の下部に表示したいのですがよい方法があるでしょうか？
- ベストアンサー
- HTML
- 入れ子になっているHTMLタグも抜き出したい
現在、/^(<([\w]+)[^>]*>)(.*?)(<\/\\2>)/という正規表現で 再帰的に処理させてHTML部分のみカットしています。 が、 <table border="1" cellpadding="2" cellspacing="0" align="right" style="margin-left:1em"><tr><td colspan="2" cellspacing="0" cellpadding="2"><table align="center" border="0"><tr><td colspan="2" align="center">aaa</td></tr></table></td></tr></table> こういった同じタグの入れ子状態になっている事を想定していなかった為 正しく抜き出しが行えず問題が発生しています。 しかし、現状の処理でずっと動作させてきたので、出来るだけ処理を変更せず 上記HTMLにも対応させたいです。 何かいい正規表現か、同等の処理はありませんでしょうか？
- 締切済み
- PHP
- ホームページビルダー8 中央配置
ホームページビルダー8でホームページを作成し公開したところ、左寄りになってしまいました。 本サイトでかなり調べて「どこでも配置モード」ではできないことを知り「標準モード」で作成し直し、レイアウト枠を含んだページすべてを1行1列の表で囲んでセンタリングを試みてもできませんでした。 レイアウト枠があるとセンタリングできないのでしょうか？ ちなみにソースは以下のようになっています。 </DIV> <TABLE border="0" width="100%" cellpadding="0" cellspacing="0"> <COL span="1" align="center"> <TBODY> <TR align="center"> <TD height="1041" align="center"></TD> </TR> </TBODY> </TABLE> </BODY> </HTML> 初心者ですのでわかりやすくお願いします。
- 締切済み
- ホームページ作成ソフト
- html→xmlの変換
後述するようなhtmlファイルがあります。 これをxmlに変換する事は可能なのでしょうか。 また、もし可能なら、その方法、ソフトなども教えていただけると幸いです。 ---以下ソース <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> </head> <body> <TABLE width="95%" border="1" cellpadding="4" cellspacing="0" bordercolor="#999999"> <tr> <td width="42%" align="CENTER" bgcolor="#BFBFDF"><font size="-1"><b>テーマ</b></font></td> <td width="9%" align="CENTER" bgcolor="#BFBFDF"><b><font size="-1">課目</font></b></td> </tr><tr> <td valign="MIDDLE" bgcolor="#FFFFFF"><a href="abc.html">テーマ1</a></td> <td valign="MIDDLE" align="CENTER" bgcolor="#c8e3e3">課目1</td> </tr><tr> <td valign="MIDDLE" bgcolor="#FFFFFF"><a href="DEF.html">テーマ2</a></td> <td valign="MIDDLE" align="CENTER" bgcolor="#ffffe0">課目2</td> </tr> </TABLE> </body> </html> ---ソース以上
- ベストアンサー
- XML
- Firefoxで崩れる
IE6.0 IE7.0では、問題なく表示されるのですが、Firefoxで 一部のページが右にずれてしまうのです。 問題点を教えていただけますと幸いです。 正常なページのソース <!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=utf-8" /> <title>XXXXXXXXXXXXXXXXXXXXXサイト</title> <META HTTP-EQUIV="Imagetoolbar" CONTENT="no"> <link href="../common/base.css" rel="stylesheet" type="text/css" /> </head> <body> <a name="top" id="top"></a> <table width="758" border="0" cellpadding="0" cellspacing="0" class="table-base"> <tr> <td height="95" colspan="2"><table width="758" cellspacing="0" cellpadding="0"> <tr> <td width="213" rowspan="4"><a href="../index.html"><img src="../common/images/rogo.jpg" width="213" height="93" border="0" /></a></td> <td height="38"> </td> </tr> </table></td> </tr> <tr> <td height="31" colspan="2"><img src="images/" alt="blog" width="758" height="31" border="0" /></td> </tr> <tr> <td height="21" colspan="2" class="td-bar"> </td> </tr> <tr> <td width="556" height="111" valign="top"><table width="543" height="182" cellpadding="10" cellspacing="0" class="td-0e3758"> <tr> <td colspan="2" class="bottom-border0e3758"><strong>200X/XX/XX</strong></td> </tr> <tr> <td width="94" height="131"><img src="images/s_img.jpg" width="94" height="125" /></td> <td width="407" valign="top">テテキストテキスト</td> </tr> </table></td> ***************************** 崩れてしまう方 <!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=utf-8" /> <title>XXXXXXXXXX</title> <link href="../common/base.css" rel="stylesheet" type="text/css" /> </head> <body> <a name="top" id="top"></a> <table width="758" border="0" cellpadding="0" cellspacing="0" class="table-base"> <tr> <td width="758" height="95"><table width="758" cellspacing="0" cellpadding="0"> <tr> <td rowspan="4"><a href="../index.html"><img src="../common/" width="213" height="93" border="0" /></a></td> <td height="38"> </td> </tr> </table></td> </tr> <tr> <td height="31" colspan="2" class="td-bar"><img src="images/blog-.gif" alt="blog" width="758" height="31" border="0" /></td> </tr> <tr> <td align="center"><table width="725" cellspacing="0" cellpadding="7"> <tr> <td colspan="2"> </td> </tr> <tr> <td width="37" align="right"><img src="../common/images/arrow.gif" width="8" height="9" /></td> <td width="658" align="left" class="text-ffffff"><span class="text-71b8ff">2007.00.00</span> XXXXXXXXXXX</td> </tr> <tr> <td align="right"><img src="../common/images/arrow.gif" width="8" height="9" /></td> <td align="left" class="text-ffffff"><span class="text-71b8ff">2007.00.00</span> XXXXXXXX</td> </tr> <tr> <td align="right"><img src="../common/images/arrow.gif" width="8" height="9" /></td> <td align="left" class="text-ffffff"><span class="text-71b8ff">2007.00.00</span> XXXXXXXXXXXXXXXXXXXXXXX</td> </tr>
- 締切済み
- HTML
- 【IE】表示が全てセルの指定に合わされてしまう症状を回避したい
既出かも知れませんが、探し出せなかったもので、質問させて頂きます。 テーブルのセルをセンター揃えに指定すると、その中に入っているテーブルの中身までセンター揃えになってしまいます。 環境はWIN・XPのIE6です。Firefoxや、Macでは、きちんと左揃えで表示されます。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>テスト</title> </head> <body> <table width="500" border="0" cellspacing="0" cellpadding="0"> <tr> <td align="center"> <table width="400" border="0" cellspacing="0" cellpadding="0"> <tr> <td bgcolor="#F5F5F5">このテキストを左揃えに！</td> </tr> </table></td> </tr> </table> </body> </html> テキスト部分を<div align="left">で囲むと左揃えになるのですが、それ以外での解決法をご存じの方、教えて下さい。よろしくお願い致します。 （左揃えの場合、特に指定を入れなくてもいいと思うのですが・・・）
- ベストアンサー
- HTML
補足
ごめんなさい。ブラウザはIE８です！