レスポンシブ対応にしたのにスマホ画面が小さい

bootstrapのgemなんかを入れてレシポンシブ対応にしたはずなのにいざスマホ画面で見ると画面が小さすぎるという問題。

本当は、こういうふうにしたいが、

viewport

こうなちゃった。

no-viewport

こういう場合は、大概、<meta name="viewport" content="width=device-width, initial-scale=1">を忘れていることが多い。

views/layouts/application.html.erbのhead部分に<meta name="viewport" content="width=device-width, initial-scale=1">を入れてやればいい。

See Also