CSS3のメディアクエリのレイアウト継承について。

Question

CSS3のメディアクエリのレイアウトについて。

●今の状態
htmlでサイトを作り、メディアクエリを使ってスマホ用サイトも作りたいと思い、

<link rel="stylesheet" href="style2.css" media="screen and (max-width:480px)"> を設定し、小さい画面のときはスマホ用のcssファイル(css2)を読み込むようにしました。

●発生した問題
スマホ用cssにスマホ用のレイアウトを設定して行こうと思い、元のpc用のcssをコピーしたものをcss2に名前を変更し、width等の要素を書き換えていったのですが、何故か反映されず、おかしいと思い、試しに一切何も書かれていないcssをcss2に設定して読み込ませてみると、何も書かれていないcssのはずなのにpc用のレイアウトが表示されました。css2で指定の要素をdisplay:noneとする設定を書き込むとちゃんと反映されるので、スマホ用cssファイルはちゃんと読み込まれてはいるようです。キャッシュを削除しても変わりませんでした。

●知りたい事
私は最初、メディアクエリでcssを変更させるとそのcssだけが読み込まれるようになるものだと思っていましたが、この状態を見るとどうやらスタイルの継承がある？のではと思いました。
ひとつだけのcssファイルの中で画面のサイズで分けていくのはわかりずらいので、できればcssファイルごと分けたいのですが、何か解決方法はないでしょうか。よろしくお願い致します。

Answer 1

PC用のCSSもメディアクエリで呼ばれてはいかがでしょうか。

<link rel="stylesheet" href="style.css" media="screen and (min-width:481px)">

Answer 2

mediaに最低値を追記して範囲設定にしたら解決しました。