CSSでテーブルを中央配置にする方法は?
- CSSでテーブルを中央配置する方法について教えてください。
- W3Cの非推奨タグを使用せずに、テーブルを中央配置する方法を教えてください。
- WinXP IE6.xではテーブルが中央に配置されるが、WinXP Netscape 7.xでは中央に配置されない場合、解決策を教えてください。
- ベストアンサー
cssでテーブルを中央配置にするには?
よろしくお願いします。 テーブルを中央配置にしたいのですが、 <center>、<div align="center">は、W3Cの非推奨タグであるため、代替方法として、<div style="text-align:center">を使用してみたのですが、うまくいきません。 <body> <div style="text-align:center"> <table> <tr> <td>あいうえお</td> </tr> </table> </div> </body> としたとき、WinXP IE6.xではテーブルが中央に配置されるのですが、WinXP Netscape 7.x では中央に配置されませんでした。どなたか解決策をご存知でしたらご教授願います。よろしくお願いします。
- hinatamama
- お礼率100% (1/1)
- HTML
- 回答数1
- ありがとう数1
- みんなの回答 (1)
- 専門家の回答
質問者が選んだベストアンサー
<div style="text-align:center"> <table style="margin:auto;text-align:left"> で、いかがでしょう?
関連するQ&A
- テーブルの中央配置
内容を中央揃えにしたく、以下のようにCSSで記述してみたのですが、テーブルが揃いません。どうすればよいのでしょうか? <head> <style type="text/css" media="screen"><!-- body { background-color: #cecece; text-align: center; } --></style> </head> <html> <body> aaa <table width="64" border="1" cellspacing="2" cellpadding="0"> <tr> <td>bbb</td> </tr> </table> </body> </html>
- ベストアンサー
- HTML
- CSSでテーブルを中央にする方法
CSSでテーブルを中央にする方法を教えてください いろいろなサイトで見た通りにしたのですが、どうしてもFirefoxではテーブルが中央によりません。 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta name="description" content=""> <meta name="keywords" content=""> <title>テーブル</title> <style type="text/css"> <!-- .tableley { margin-left: auto; margin-right: auto; text-align: center; } //--> </style> </head> <body> <div class="tableley"> <table cellpadding="0" cellspacing="0" summary="テスト" border="1"> <caption style="font-weight: bolder;">てすと</caption> <tbody> <tr> <td>てすと1</td> <td>てすと2</td> <td>てすと3</td> <td>てすと4</td> </tr> <tr> <td>てすと5</td> </tr> </tbody> </table> </div> </body> </html> 何が悪いのでしょうか? <div align="center">にするしか方法がないのでしょうか? 文法検証すると<div align="center">はあまりよくない使い方と指摘されてしまいます よろしくお願いします。
- ベストアンサー
- HTML
- IE8などでCSSでテーブルを中央に、テーブル内のテキストは左寄せにしたい
お世話になっております。 ・本文・テーブルは中央揃え ・テーブルの内容は左揃え というものをCSSで作りたいのですが、 どのようにしたらいいのでしょうか。 現在のページの一部は <div id="main"> <h1>タイトル</h1> <table border="1"> <p> 本文 </p> <tr> <td colspan="2"><h2 align="center">○○○</h2></td> </tr> <tr> <td>内容</td> <td>内容</td> </tr> ~行が続きますが省略~ </table> </div> のようになっています。 ちなみに cssのmainは「text-align:center;」を指定しておりますが、 IE8にしたところテーブルが左寄せになってしまいました。 なるべく多くのブラウザで同じような配置になるようにしたいのですが どうしたらよいでしょうか。よろしくお願いいたします。
- ベストアンサー
- 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
- スタイルシートでの中央揃え
<html> <head> <title>文書のタイトル</title> <meta http-equiv="Content-Style-Type" content="text/css"> <style> body{text-align: center;} </style> </head> <body> <table> <tr> <td> テーブルの内容 </td> </tr> <table> テーブル外の内容 </body> </html> のように、スタイルシートで、 body{text-align: center;} を指定したのですが、IE6ではtableが中央揃えされましたが、NN7.1やFirefox 1.5.0.7ではtableが中央揃えされませんでした。 centerタグを使えば問題ありませんでしたが、非推奨なのであまり使いたくありません。 スタイルシートを用いてIE6と同様にNNやFirefoxでtableを中央揃えするようにするにはどうすればいいでしょうか。
- ベストアンサー
- HTML
- CSSのtableについて【CSSが無かったのでHTMLで…。】
<html> <head> <title>test</title> <style type="text/css"> <!-- table { border : 1px #000000 solid; text-align : center; } td,th { border : 1px #000000 solid; width : 100px; } --> </style> </head> <body> <table> <tr> <td rowspan="2"> 1 </td> <td> 3 </td> </tr> <tr> <td> 2 </td> </tr> <tr> <td colspan="2"> 3 </td> </tr> </table> </body> </html> このように入力をした場合、一番下にできるテーブル(3)2つ結合しているにもかかわらず、1つ分?の状態で文字がcenterになってしまいます。結合した(2つの)真ん中に表示させるにはどうしたらいいですか?? 教えてください☆
- ベストアンサー
- HTML
- cssでテーブルの位置を設定するには?
<table border="1" align="left">でテーブルの位置を競ってすることはできたのですが スタイルシートで行いたいです。 そもそも他のテーブルはすべて中央に寄せたいため、 table { margin-left: auto; margin-right: auto; } としています。 そのうえで、任意のテーブルのみ左に寄せて表示したいので table.test { align:left; } としたのですが、うまくいきません。 ---------------------------------------------------------- <html> <head> <title>test</title> <STYLE type="text/css"> table { margin-left: auto; margin-right: auto; width: 40%; } table.test { width: 80%; align:left; } </STYLE> </head> <body> <table border="1"> <tr><th>見出</th><th>見出</th></tr> <tr><td>セル</td><td>セル</td></tr> </table> <br><br><br> <table border="1" align="left"> <tr><th>見出</th><th>見出</th></tr> <tr><td>セル</td><td>セル</td></tr> </table> <br><br><br> <table border="1" class="test"> <tr><th>見出</th><th>見出</th></tr> <tr><td>セル</td><td>セル</td></tr> </table> </body> </html> ----------------------------------------------------- このコードだと、 table.test { width: 80%; align:left; } の、 width: 80%; の部分は認識されるようですが、align:left;は無視されます。 スタイルシートでテーブルの位置を設定する方法をご教授ください。
- 締切済み
- CSS
- CSS中央そろえについて
CSSを使用し、中央そろえを行っているのですが、winNN、winOperaでテーブル事態がセンターによりません。テーブルを寄せるのには無理があるのでしょうか ▼CSSファイル -------------------- /*TABLE*/ body { border: 0; margin: 0; padding: 0; font-family:Verdana,Arial,Helvetica,sans-serif; color:#333333; background:#fff; text-align: center; } #layout #frame{ border: 0; margin: 0; padding: 0; width: 300px; background: #ccc; } -------------------- ▼HTMLファイル <div id="layout"> <table cellspacing="0" cellpadding="0" summary=" " id="frame"> <tr> <td>aaa</td> <td>aaa</td> </tr> </table> </div>
- ベストアンサー
- CSS
- HTMLでテーブルをfloatで中央配置に並べたい
よろしくお願いします。 floatを使ってテーブルを横に複数個並べているのですが、全体が左に寄ってしまいます。 並べたテーブルすべてを中央に配置するにはどうしたらよいのでしょうか。 テーブルとテーブルの間の隙間を固定にしたいので、マージンは固定です。 ■HTML <body> <table><tr><td>TEST1</td></tr></table> <table><tr><td>TEST2</td></tr></table> <table><tr><td>TEST3</td></tr></table> </body> ■CSS table{ float: left; width: 100px; border: 1px solid #000000; margin: 0px 10px 0px 10px; } よろしくお願いいたします。
- ベストアンサー
- CSS
- 文字を中央に寄せる
<HTML> <HEAD> <TITLE>メンバー表</TITLE> <STYLE TYPE="text/css"> <!-- TR{text-align:center;} TH{text-align:center;} TD{text-align:center;} --> </STYLE> </HEAD> <BODY> <TABLE BORDER=1 ALIGN=CENTER> <TR><TH ROWSPAN=3>ここには画像</TH><TH>名前</TH><TH>称号</TH><TH>レベル</TH><TH>タイプ</TH><TH>AC</TH></TR> <TR><TD>竜千士 翔</TD><TD>見習い魔導士</TD><TD>45</TD><TD>con18,wis18</TD><TD>43</TD></TR> <TR><TD>コメント</TD><TD COLSPAN=4>v( ̄Д ̄)v イエーイ </TD></TR> </TABLE> </BODY> 上記のようにスタイルシートで文字を中央に寄せようとしたのですがどうしてもできません。 htmlタグでやるとできたのですが・・・ どこが間違っているのかどうかご教授お願いいたいします。 ちなみに使っているブラウザはIEでバージョンは6 です
- ベストアンサー
- HTML
お礼
おかげさまで、無事解決いたしました。 参考URLも拝見し、非常に勉強になりました。 ありがとうございました。