noscriptタグにCSSが適応されません。

質問

下記のようにコーディングをしたのですが、noscriptタグにCSSが適応されません。

noscriptタグは特殊でCSSが当てられないのでしょうか？
デブツールズで見ても、noscriptタグのCSSには親要素の継承した情報しかありませんでした。

div#loading_imgにカラーなどをいれるとちゃんと継承します。

ＨＴＭＬ
<!--Loading Image-->
<div id="loading_img">
<img src="img/base/loading.gif" width="128" height="15" />
<p>Now Loading</p>
<noscript>当サイトはjavascriptを使用しています。</br>javascriptをONにしてください。</br>ONにしなければこの表示は消えません。</noscript>
</div>

ＣＳＳ
/*Loading Image*/
div#loading_img {
position: fixed;
top: 50%;
right: 50%;
bottom: 50%;
left: 50%;
z-index: 9999;
width: 128px;
margin: -7.5px 0px 0px -64px;

}

div#loading_img p {
text-align: center;
color: #02CCFF;
}

noscript {
text-align: center;
color: #044901!important;
font-weight: bolder;
}
/*Loading Image End*/

回答No.1

4017B · ベストアンサー

CSSで指定する場合、単に noscript {...} だと上手く機能しないので…。

--------------------
◆CSS記述
p.noscript { color:#f00; }

◆HTML記述
<noscript><p class="noscript">当サイトはjavascriptを使用しています。</p></noscript>
--------------------

～上記の様に何か適当な<p>なり<div>なりを割り振って、それにCSSを当てる様な方法にしてみてください。

お礼

ありがとうございます。

noscriptはなぜかCSSが効かないのですね。

何をやってもだめだった理由がおかげさまでわかりました。

教えていただいたようにするか、仕方がないので親要素に設定するかのどちらかですね。

補足

なぜnoscriptは効かないのでしょうか？

バグでしょうか？