Media QueriesがIE8で効かない場合の対処法

iPad 向け、iPhone 向けにWEBサイトの最適化を色々と試しながら、
「まだまだ奥が深いなぁ、Media Queries…」
と思っていた最中、IE8 で落とし穴です > <

IE8 ではもともと Media Queries が効かないため、css3-mediaqueries.js を利用して

<!--[if lt IE 9]>
<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->

目次

（１）css3-mediaqueries.js を読み込んでいない

<!--[if lt IE 9]>
<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->

<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->

<!--[if lt IE 9]>
<script src="https://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->

（２）CSS のリンクの問題

<style>
@import "base.css";
@import "font.css";
@import "style.css";
</style>

<link rel="stylesheet" href="base.css">
<link rel="stylesheet" href="font.css">
<link rel="stylesheet" href="style.css">

（３）CSS の記述ミス

@media (min-width: 1200px){
}

@media screen and (min-width: 1200px) {
}

（４）saved from url の問題

<!-- saved from url=(0013)about:internet -->