レスポンシブになるように Rails アプリを作成しました。フッターに最も顕著な違いがあり、メニューは指が大きい人にとってより使いやすくなっています.
Firefox でアプリをテストし、幅を縮小すると、以下のようにモバイル スタイルが表示されます。
しかし、iOSシミュレーターでテストしたところ、この結果が得られました
私の最初の本能は、ビューポート メタ タグのヘッドをチェックインすることでした。
RefineryCMS では、これがデフォルトのようです。
<meta charset='<%= Rails.application.config.encoding %>' />
<!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /><![endif]-->
<title><%= browser_title(yield(:title)) %></title>
<%= raw %(<meta name="description" content="#{@meta.meta_description}" />) if @meta.meta_description.present? -%>
<%= raw %(<link rel="canonical" content="#{@canonical}" />) if @canonical.present? -%>
<%= csrf_meta_tags if Refinery::Core.authenticity_token_on_frontend -%>
<%= yield :meta %>
<%= stylesheet_link_tag "application" %>
<%= yield :stylesheets %>
<%= render '/refinery/google_analytics' %>
<%= javascript_include_tag 'modernizr-min' %>
そこにいないので、タイトルの前に追加してテストしました
<meta charset='<%= Rails.application.config.encoding %>' />
<!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /><![endif]-->
<meta name="viewport" id="view" content="width=device-width minimum-scale=1, maximum-scale=1" />
<title><%= browser_title(yield(:title)) %></title>
これが私が得た結果です
しかし、他に注意する必要があることはありますか？