レスポンシブがPCで見たときとスマホ画面で見た時に違う

Question

コーディング初心者です。
実際にサーバーにあげて自分のスマホで見た時にPCで作ったレスポンシブと大幅にレイアウトが違って崩れてしまいます。
大幅に崩れなくする方法がありましたらお教えいただきたいのと
どちらかに合わせた場合、どちらに合わせるべきなのでしょうか？
またその場合崩れる方はどうすればいいのでしょうか…

一応メディアクエリの記述を置いておきます。

@media screen and (min-width:480px) and (max-width:599px)  {}

Comments

[KojiDoi]

何をもって理想の在り方としているのでしょうか。レスポンシブを目指す以上、PCとスマホで「レイアウトが違う」のは当たり前（変わらなければレスポンシブではない）ので、ここが不満であるというのをもっと具体的に説明しないと回答が付きにくいと思います。

Answer 1

自己解決いたしました。
PCで作ったレスポンシブとはブラウザの幅を狭めた時のことを言っておりました。
言葉足らずで申し訳ございません。

Answer 2

PCで作ったレスポンシブ、という意味がいまいち掴めていないのですが、レスポンシブ（PC、SPのCSSをメディアクエリで切り替えて表示すること）の対応はした上で崩れてしまっているのでしょうか？

上記のメディアクエリだと480px以上599px以下で{}内部のCSSが適用されるはずなので、450pxとかで見ると{}内のCSSが全く当たっていないことになります。
なのでまずはそこを直す必要があると思いました。