ホームページ作成 質問過去ログ

                                Page       5
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   通常モードに戻る  ┃  INDEX  ┃  ≪前へ  │  次へ≫   
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
 ▼CSSを使ったテーブルのセンタリングについて  KYYN51 03/7/30(水) 17:25
   ┗Re:CSSを使ったテーブルのセンタリングについて  105 03/7/31(木) 0:22
      ┗Re:CSSを使ったテーブルのセンタリング...  KYYN51 03/7/31(木) 14:35
         ┗Re:CSSを使ったテーブルのセンタリング...  105 03/7/31(木) 23:19

 ───────────────────────────────────────
 ■題名 : CSSを使ったテーブルのセンタリングについて
 ■名前 : KYYN51
 ■日付 : 03/7/30(水) 17:25
 -------------------------------------------------------------------------
   こんにちは、初めまして。「KYYN51」というものです。

最近HPを作り始めたのですが、その際「1時間で作るホームページ」
のレクチャーを色々と参考にさせてもらいました。
ありがとうございました。m(_ _)m

早速質問したいことがあるのですが、
『CSSを使ってテーブルを中央(横方向)に配置する方法』
についてです。

CENTERタグを使用すると簡単に実現できるのですが、
W3C曰く「CENTERタグは非推奨で廃止予定」だそうなので、
変わりにCSSで実現させたいと思っているのですが、
ブラウザの種類によっては、うまく表示されません。

例えばdivをtext-align:aenter;の設定で定義し、その中にテーブルを配置
してみたのですが、IEではうまくいってもNS、OPERA等ではうまくいきません。

CSSのサポート状況による限界かな、と半分諦めているのですが、
一縷の望みを託して本BBSに投稿してみました。
どなたかご存知の方がいましたら、ご教授お願いします。
「実現不可能」の回答でもかまいません。

ちょっとマニアックな質問になってしまいましたが、よろしくお願いします。
 ───────────────────────────────────────  ■題名 : Re:CSSを使ったテーブルのセンタリングについて  ■名前 : 105  ■日付 : 03/7/31(木) 0:22  -------------------------------------------------------------------------
   ▼KYYN51さん:
>こんにちは、初めまして。「KYYN51」というものです。

こんばんは。
過去に同じことを調べて困ったおぼえがありますので
答えというより意見交換ということで。

最初にたどりついた結論から言うと
特にこだわりがない場合は
<div align="center">が現時点では、一番良いと思っています。

>CENTERタグを使用すると簡単に実現できるのですが、
>W3C曰く「CENTERタグは非推奨で廃止予定」だそうなので、
>変わりにCSSで実現させたいと思っているのですが、
>ブラウザの種類によっては、うまく表示されません。
>例えばdivをtext-align:aenter;の設定で定義し、その中にテーブルを配置
>してみたのですが、IEではうまくいってもNS、OPERA等ではうまくいきません。

W3Cの勧告を見ると
テーブルなどブロック要素自体はセンタリングはせずに
中のテキストなどインライン要素をセンタリング
という解釈が正解のようです。

つまり、IEの表示方法が間違っていて、ネスケ・OPERAが
正解なのではないかと思います。

じゃぁ、センタリングするCSSは何?となるわけですけど
http://www.mozilla.gr.jp/standards/webtips0004.html
こちらのページが参考になります。

実際のところ、勧告は行われたけども
ブラウザーの解釈の違いが壁になってしまい
CSSが使いにくいものになってしまっているのが現状です。

個人的な予想ですが、align="center"が使えなくなってしまう
ということは、ないのではないかとも思っています。
ブラウザーを作っている人達が以下の選択を迫られたとすると

・勧告で廃止になったから、align="center"は無視しよう。
・廃止になったけど、既に多く使われているから残しておこう。

たぶん、後者を取ると思いますので。


「1時間で作る」内でもtext-align:aenter;を使っていますが
もう少し考えて整理できたらalign="center"記述に変更する
予定です。
 ───────────────────────────────────────  ■題名 : Re:CSSを使ったテーブルのセンタリング...  ■名前 : KYYN51  ■日付 : 03/7/31(木) 14:35  -------------------------------------------------------------------------
   丁寧な解説ありがとうございます。(ちょっと感動しました)

>W3Cの勧告を見ると
>テーブルなどブロック要素自体はセンタリングはせずに
>中のテキストなどインライン要素をセンタリング
>という解釈が正解のようです。
>つまり、IEの表示方法が間違っていて、ネスケ・OPERAが
>正解なのではないかと思います。

なるほど、やはりそうだったのですね。
薄々インライン要素専用のセンタリングかなと感じていたのですが、
天下のIEにだまされてしまいました。

>じゃぁ、センタリングするCSSは何?となるわけですけど
>http://www.mozilla.gr.jp/standards/webtips0004.html
>こちらのページが参考になります。

ありがとうございます。とても参考になりました。

>実際のところ、勧告は行われたけども
>ブラウザーの解釈の違いが壁になってしまい
>CSSが使いにくいものになってしまっているのが現状です。

その様ですね...まったく同感です。
私も、IE環境でCSSを駆使して作成したHPを、
初めてネスケで見たときには唖然としてしまいました。

仕様の決定機関と、開発機関(企業)が別々なのが原因なのかな。
(システム開発ではよくある話なのですが...)

><div align="center">が現時点では、一番良いと思っています。

私もCSSの解釈が統一されるまで<div align="center">で対応したいと思います。
(ただ、見栄を張ってstrictで作っってしまったので、ちょっと苦戦するかも)


丁寧なアドバイス、本当にありがとうございました。
これからも宜しくお願い致します。
 ───────────────────────────────────────  ■題名 : Re:CSSを使ったテーブルのセンタリング...  ■名前 : 105  ■日付 : 03/7/31(木) 23:19  -------------------------------------------------------------------------
   ▼KYYN51さん:

>薄々インライン要素専用のセンタリングかなと感じていたのですが、
>天下のIEにだまされてしまいました。

このあたりも見方を変えると、おもしろいですよ。

ネスケ・OPERA → W3Cの勧告を正確に解釈して、規格どおりのレンダリングを。
IE → 全部センタリングのほうが、ユーザーには使いやすいだろう。

もちろん、想像というか妄想の範囲ですので、実際のところはわかりませんけど。

>私も、IE環境でCSSを駆使して作成したHPを、
>初めてネスケで見たときには唖然としてしまいました。

HTMLだけでも、複数のブラウザ(バージョンとかも)OSで
ピッタリ同じにするのは、とても難しいですから
複雑なレイアウトを組む場合は、悩みの種になりますよね。


>仕様の決定機関と、開発機関(企業)が別々なのが原因なのかな。
>(システム開発ではよくある話なのですが...)

出来るかどうかは別にして、レンダリング部分だけは
同じにするとか出来ればいいんですけどね。
この場合でも各企業の販売戦略から、独自仕様は
出てくると思いますので、難しいでしょうか。
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━    通常モードに戻る  ┃  INDEX  ┃  ≪前へ  │  次へ≫    ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━                                 Page 5