人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

CSSでの優先度について教えてください。

現在、Myspaceのデザインを修正しています。
Myspaceは、HTML上の特定の箇所を修正できるため、その中にCSSを記述しています。

レイアウトとして使われているtableタグにはID属性が設定されているため、ある程度は思い通りになるのですが、どうしてもうまくいかない場合があります。

具体的には、デフォルトで設定されているCSSを上書きする目的で"!important"を適用しても、反映されない事があるのです。

例えば、
<table id="abc">
<tr><td>&nbsp;</td></tr>
</table>
のようなタグの場合、
table#abc
{background-color:#000000!important;}
と設定しても反映されません。
tableタグの中でstyle指定をしている訳ではないのに、なぜかうまくいきません。

しかし、海外のサイトを参照して分かったのは
table[id=abc]
{background-color:#000000}
のように記述すると、Firefoxは反映されます。IEは反映されません。


そこで質問なのですが、
1. どうすれば、!importantより優先度の高い記述ができるでしょうか?
2. この、[id=abc]という設定方法について詳しく教えてください。
(うまく検索ができないため)

宜しくお願い致します。

●質問者: rimk
●カテゴリ:ウェブ制作
✍キーワード:#000000 ABC background-color CSS firefox
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● Cherenkov
●100ポイント ベストアンサー

1. 元々記述されているスタイルがわからないと対策ができません。table#abcとはMySpaceでいうと具体的にどのIDですか。

「CSSの優先順位?CSSテクニック?」にわかりやすく解説されています。



2.「属性セレクタ」という指定方法です。「CSS 概説 | セレクタ」によると「属性セレクタ p[id="URI"] よりも p#URI の方が優先します」だそうです。



参考

◎質問者からの返答

2.について、ありがとうございました。欲しかった情報です。

1.について、

具体的には

(※tableごと非表示にしたい)


2 ● Cherenkov
●35ポイント

Firefox3.5、IE8で確認しました。「IEは反映されない」も再現しました。

結論からいうとIEはtable[id="musicJVNav"]という属性セレクタを用いたidの指定に対応してないようでした。

ここは素直にIDセレクタを用いて、

#musicJVNav {display:none;}
#leftNav li a {color:pink;}

としてみてはいかがですか。table#musicJVNavとしてもOKです。

この指定方法はMySpace側の記述と切り口が異なるので!importantが要りません(保険としてつけておいてもいいでしょう)。

◎質問者からの返答

うーん、やはり難しいようです。

ユーザー側で無理矢理スタイルシートを使うと、本来正しく無い場所(※)にCSSが<style>
関連質問



●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ