ヘッダーファイルで外部からCSSを読み込んで、内部でJavaScriptの構文を書いたら、CSSが適用されなかった。
(IE6で発生)

以下、CSSが適用されなかった構文

<head>


<link rel="stylesheet" href="base.css" type="text/css" />
function openWin(){
  var subWin=window.open("sample1.htm","Sample","width=480,height=320,
location=no,scrollbars=no,menubar=no");
  subWin.document.myform.keiken.value="100";
  subWin.document.getElementById("ichi").innerHTML="愛知";
}
</head>

JavaScriptは動くが、CSSは適用されない。


逆にすると、今度はCSSは適用されるがJavaScriptが動かない。

以下、JavaScriptが適用されなかった構文

<head>


function openWin(){
  var subWin=window.open("sample1.htm","Sample","width=480,height=320,
location=no,scrollbars=no,menubar=no");
  subWin.document.myform.keiken.value="100";
  subWin.document.getElementById("ichi").innerHTML="愛知";
}
<link rel="stylesheet" href="base.css" type="text/css" />
</head>


何でこうなるの??と思いつつインターネットで調べても分からず5時間経過。


もう、試行錯誤の嵐の結果このようになった。

JavaScript文は外部ファイル化(sw1.js)した。

それでも直らず、以下のようにした。

<script src=""></script>
<link rel="stylesheet" href="base.css" type="text/css" />
<script src="sw1.js" type="text/javascript"></script>


こんな構文でいいのかと思いつつ、これでしか動かないCSSに憤りを感じていた。

JavaScriptは外部ファイル化しないと、エラーがでてうまく行かなかった。

いったんエラーに陥ると、JavaScriptの部分を削除してもCSSが適用されなくなる。

エラーの内容がわかるまでこれで行くしかないか。。