CSSでtext-align

不思議な現象が起きてます。

2行7列の表を作って、
2行目の3～5列と7列目を右寄せにしたいがために、
<td class="right">
で外部CSSに
.right{
text-align:right;
}
と記述したところ適用されませんでした。
しかしインラインで
<td style="text-align:right;">
と書くと右寄せになるんです・・・

原因がわからずこまっています。
ちなみに
<td align="right">
でも表示されませんでした・・・

table全体には以下のCSSが外部で適用されてます、
div.gray_box {
background-color: #FFFFFF;
border-color: #CCCCCC;
border-style: solid;
border-width: 1px;
padding: 1px 0 1px 0;
}
table.wide_table_border {
border: 1px solid #FFFFFF;
border-collapse:collapse;
margin: 0px auto;
padding: 5px;
width: 100%;
}
あまり関係ないとは思うのですが一応載せておきます。

目的としては、必ず外部CSSに記述することです。

No.1 ベストアンサー 回答者： yambejp 回答日時： 2007/05/10 11:37

デバグの方法としてはこんなところですかねぇ

(1)HTML内部に
<style type="text/css">
.right{
text-align:right;
}
</style>
として反映するかどうか確かめる

(2)class名をかえてみる。
rightなんて一般的な名前だと別の箇所で実はつかわれてる可能性も
あるでしょうから、たとえばtdrightなどにしてみる

(3)cssの表記にタグを明示する
td.right{・・・}

(4)important宣言してみる
text-align:right ! important;

この回答への補足

どれも効果無しでした。

やはり該当する場所が左寄せになってしまいます・・・

補足日時：2007/05/10 11:47

この回答へのお礼

すみません。

４で解決しました。
importantの詳しい役割がよくわからず、
それで解決したということはどういうことがいえるのか解説願えますでしょうか？

お礼日時：2007/05/10 11:53

No.2 回答者： yambejp 回答日時： 2007/05/10 12:26

状況からすると、cssファイルが無効になっているという致命的な

話ではなさそうですね。
また、クラス名やIDの競合でもなさそうなので、
おそらく別要素などでtext-alignが指定されているものが優先されている
と類推します。

あやしいのは
*、body、table、tr、tbody、tdなどタグにtext-alignが設定されていませんか？
その場合は順位をあげるような記述をする必要があると思います。
基本的には! importantは、やむにやまれないときにしか使わないほうが
よいですから。（使っちゃいけないとは言いませんが、見る人がみれば
センスやスキルがないプログラマだと思われることでしょう・・・）

この回答への補足

なるほど・・・

CSSを調べてみたところ、
確かに他の部分でかかっているtext-alignがありました。

ありがとうございました。

補足日時：2007/05/10 12:34