Shopify网站在Ipad Only的右侧提供空白区域

Question

我在本网站fearofmissingoutfomo.com遇到问题，在iPad上观看时右侧有一个白条。 我的代码是

html,body { 
margin: 0; 
padding: 0;
border: 0;
@include smooth_font();}
{% if settings.use_bg_image %}
body {
background: {{settings.shop_bg_color}} url({{ 'bg.png' | asset_url }}) 0 0 no-repeat;
}
body.index-template {
 background: {{settings.shop_bg_color}} url({{ 'bg.png' | asset_url }}) 0 0 no-repeat;
padding-top: 40px;
padding-bottom: 40px;
}

非常感谢帮助。我也看到了一些相关的主题，但无法将其与我的问题联系起来。感谢。

Answer 1

由于此部分，问题正在发生：

目前你的部分有像这样的HTML

<div id="shopify-section-1509186783462" class="shopify-section  index-section products-grid">
   <section data-section-id="1509186783462" data-section-type="products">
      <div class="section-header text-center">
         <h2>View our featured christmas items</h2>
      </div>
      <div class="grid grid--uniform grid--view-items">
         ......
      </div>
      <div class="text-center view-more btn">
         <a href="/collections/christmas">
         See more
         </a>
      </div>
   </section>
</div>

您应该修复此问题并添加container和row，例如：

<div id="shopify-section-1509186783462" class="shopify-section  index-section products-grid">
   <section data-section-id="1509186783462" data-section-type="products">
      <div class="container">
         <div class="row">
            <div class="section-header text-center">
               <h2>View our featured christmas items</h2>
            </div>
            <div class="grid grid--uniform grid--view-items">
               ......
            </div>
            <div class="text-center view-more btn">
               <a href="/collections/christmas">
               See more
               </a>
            </div>
         </div>
      </div>
   </section>
</div>