让应用在纵向和横向模式下看起来相同答案

【问题标题】：Getting app to look the same in portrait and landscape mode让应用在纵向和横向模式下看起来相同
【发布时间】：2014-11-11 14:41:44
【问题描述】：

我是 Foundation 5 的新手。

我正在尝试让我的应用在小屏幕设备上的纵向和横向模式下看起来相同。我没有更改任何 Foundation 设置。

我附上了两张以纵向和横向模式显示我的应用的图片。

肖像：http://i.imgur.com/E308Jsd.png 景观：http://i.imgur.com/O11D57g.png

在横向模式下，文本变得太大（请参阅“产品名称”和“产品描述”）。如何获得与纵向模式相同的外观？

这是我的代码：

 <% @Products.each do |product| %>
<div class="row">
   <div class="small-12 columns">
     <%= link_to product.name, product_path(product) %>
   </div>
</div>
<div class="row">
  <div class="small-12 medium-9 large-7 columns end">
    <%= product.description %>
 </div>
</div>
<div class="row">
    <div class="small-12 columns">
      <ul class="inline-list">
        <li>
          <%= product.location %>
        </li>
        <li>
          <%= product.type %>
        </li>
      </ul>
    </div>
</div>
<% end %>

出于某种原因，如果我将列更改为 small-8 列，我可以在两种模式下获得相同的外观。

任何帮助将不胜感激。

【问题讨论】：

标签： zurb-foundation

【解决方案1】：

我通过在我的 CSS 文件中添加以下内容解决了这个问题：

@media only screen and (min-width : 320px) and (max-width : 560px) {
    body {-webkit-text-size-adjust: none;}
}

参考：http://community.sitepoint.com/t/iphone-landscape-view-blows-up-font-sizes/30010

【讨论】：