tableの位置がIEとその他ブラウザでずれる

質問

http://allergy.6.ql.bz/tokusyu.html
上記サイトのtableの位置がIEとその他ブラウザでずれてしまいます。
http://css-happylife.com/archives/2007/1025_1325.php

上記のような情報があるのですが、このページの場合どのCSSに入れればよいのでしょうか？
またこれはいったいどんな原理なのでしょうか？

また下記のようにすればIEのバグの問題を解決できると聞いたのですが、これを入れれば解決できるのでしょうか？
*{
margin:0;
padding:0;
font:normal normal normal 100%/1.3 "ＭＳ Ｐゴシック","Osaka",sans-serif;
border:none;}

font:normal normal normal 100%/1.3 "ＭＳ Ｐゴシック","Osaka",sans-serif;
この記述の意味は何なのでしょうね？

回答No.2

ORUKA1951 · ベストアンサー

【カスケーディング】スタイルシート・・CSSを身に付けようとされているのでしょうね。そのとき、最初に覚えなければならないのは、カスケーディングです。
　カスケーディングとは、「あることが次々に影響を及ぼしていく」と言うような意味で、CSSのもっとも便利な機能です。そのために、現在ではWeb標準となっています。(HTML5では宣言しなくてもCSSだと判断される。)
　ところが、多くのCSS説明サイトではこの仕組みについての言及が、ほとんどされていません。

　各ブラウザで表示が異なるのは、スタイルが適用される--カスケーディング--の仕組みが
ユーザーの最重要宣言
↓
著者の最重要宣言
↓
著者の宣言
↓
ユーザーの宣言
↓
デフォルトの宣言(ブラウザの持っているスタイルシート)
となっているからです。

★tableに関するプロパティを指定漏れがあると表示を同一には出来ません
★逆にtableに設定可能なすべてのプロパティについて、きちんと指定しておくと表示をそろえることが出来ます。

*{
margin:0;
padding:0;
font:normal normal normal 100%/1.3 "ＭＳ Ｐゴシック","Osaka",sans-serif;
border:none;}

の意味は、*(全称セレクタ=詳細度[0])で、margin,padding,font(簡略化プロパティ),borderについて指定しています。
　しかし、それ以外のtableに関連するたくさんのプロパティや一般的なプロパティについては指定がありませんからカスケーディングのルールに従ってデフォルトのスタイルシートが適用されるからです。

　本来は全称セレクタ(*)で、これらの指定を抹消するのは避けるべきです。これもデフォルトのこれらの設定を消してしまうため、すべての要素について適当な値を設定しなければならなくなるからです。
　たとえば、箇条書きに関する(ul,ol,dl,dt,dd,li)などの要素について、すべて設定しなおさなければならなくなります。

　カスケーディングを本気で身に付けようとされるなら、まずカスケーディングの仕組みについて学んでください。そうすると、無駄なHTMLを書く必要もなくなりますし、CSSも随分と簡単になります。
　たとえば、現行のHTML(がきちんと書かれていたら)に一切class名やidを付け加えなくても、HTMLに手を加えずデザインを変えることが出来ます。

5. セレクタ ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/selector.html )
6. 値の割り当て、カスケード処理、継承 ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/cascade.html )
(注)カスケーディングのうち詳細度などは、CSS2.1(現在ウェブ標準)では多少変更されています。ただ、CSS2.1の仕様書の邦訳は知りません。
　→Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification ( http://www.w3.org/TR/CSS2/ )
　→変更点 ( http://www.d-toybox.com/spec/CSS2.1/appendixC/ )はあります。

お礼

ありがとうございます。お忙しい中大変ありがとうございました。

難しいのでじっくり時間をかけて拝見させて頂きます。

回答No.1

chie65536（@chie65535）

＞上記サイトのtableの位置がIEとその他ブラウザでずれてしまいます。

tableがページ上のどの位置に表示されるかは「明確な規定が無い」ので、どこに表示されても文句は言えません。

また「CSSが必ずサポートされているという規定も無い」ので、ブラウザによっては、すべてのCSSを無視します。

なので「どのブラウザででも、必ず同じ位置にtableを配置する事は不可能」です。

このような「ブラウザの違いによる表示の違い」を解消する場合は「すべてを１枚の画像にする」しかありません（flashでも同様の解消を行えますが、すべてのブラウザでflashが動くという保証はありません）

お礼

ありがとうございます。お忙しい中大変ありがとうございました。