Проблема со строкой прокрутки по горизонтали

Question

У меня проблема с этой страницей http://goo.gl/Vdu4Q0 с дополнительным пространством по оси x и не знаю, почему. Я также искал этот форум для ответов, но не нашел ничего, что применялось, поэтому я приношу свои извинения, если что-то там, которое я забыл. Я перепроверил мою структуру HTML, чтобы увидеть, есть ли какие-то незакрытые divs, но я ничего не вижу. У кого-нибудь есть идеи? Вот структура Wordpress:

HEADER

<header class="full left header-bg"> 
    <div class="container"> 
     <div class="container-inside left"> 
      <div class="sixteen columns"> 
       <h1 class="logo abs"> 
        <a href="<?php echo get_option('home'); ?>"/> 
         <img src="<?php echo get_stylesheet_directory_uri();?>/images/logo.png"/></a> 
        </a> 
       </h1> 
       <nav> 
        <?php st_navbar(); ?> 
       </nav> 
      </div> 
     </div> 
    </div><!--container--> 
</header> 

>

LOOP PAGE

<?php if (have_posts()) while (have_posts()) : the_post(); ?> 



        <?php if (!is_page_template('onecolumn-page.php')) { ?> 
         <?php if (is_front_page() && !get_post_meta($post->ID, 'hidetitle', true)) { ?> 

          <div class="full left secondary-bg"> 
           <div class="container"> 
            <div class="sixteen columns"> 
             <div class="eight columns offset-by-four"> 
              <div class="hp-text-bg"> 
              <?php the_content(); ?> 
              </div> 
             </div> 
            </div> 
           </div> 
          </div> 
          <div class="full left home-posts-bg"> 
           <div class="container"> 
            <div class="sixteen columns"> 
             <div class="five columns post-bg alpha"> 
              <div class="post-bg-wrapper"> 
               <h2>TATTOO OF THE WEEK</h2> 
                <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
                 <div class="center img"> 
                  <a href="#" title="Tattoo Of The Week"><img src="<?php echo get_stylesheet_directory_uri();?>/images/tow-img.png"/></a> 
                 </div> 
               <p class="primary-link"><a href="#">Read More</a></p> 
              </div> 
             </div> 
              <div class="six columns post-bg"> 
               <div class="post-bg-wrapper"> 
                <h2>JEWELRY</h2> 
                 <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
                  <div class="center img"> 
                   <a href="#" title="Jewelry"><img src="<?php echo get_stylesheet_directory_uri();?>/images/jewelry.png"/></a> 
                  </div> 
                 <p class="primary-link"><a href="#">Read More</a></p> 
               </div> 
              </div> 
             <div class="five columns post-bg omega"> 
              <div class="post-bg-wrapper"> 
               <h2>AFTERCARE</h2> 
                <p class="p-description-blue"> Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
                 <div class="center img"> 
                  <a href="#" title="Aftercare"> <img src="<?php echo get_stylesheet_directory_uri();?>/images/aftercare.png"/></a> 
                 </div> 
                <p class="primary-link"><a href="#">Read More</a></p> 
              </div> 
             </div> 
            </div> 
           </div><!--container-->  
          </div> 

        <?php } elseif (!get_post_meta($post->ID, 'hidetitle', true)) { ?> 

         <h1 class="entry-title"><?php the_title(); ?></h1> 

        <?php } else { 
         echo '<br />'; 
        } ?> 
       <?php } ?> 

        <div class="full left"> 

         <?php wp_link_pages(array('before' => '<div class="page-link">' . __('Pages:', 'skeleton'), 'after' => '</div>')); ?> 
         <?php edit_post_link(__('Edit', 'skeleton'), '<span class="edit-link">', '</span>'); ?> 
        </div><!-- .entry-content --> 


       <?php comments_template('', true); ?> 

<?php endwhile; // end of the loop. ?> 

FOOTER

<!-- start of footer --> 
<footer> 
    <div class="full left pre-footer-bg"> 
     <div class="container "> 
      <div class="sixteen columns"> 
       <div class="five columns alpha"> 
        <h5>CONNECT</h5> 
        <a href="https://www.facebook.com/pages/Bound-by-Design/161508617202460" target="_blank"><img src="<?php echo get_stylesheet_directory_uri();?>/images/icon-fb.png"/></a> 
        <a href="mailto:bound303@yahoo.com" target="_blank"><img src="<?php echo get_stylesheet_directory_uri();?>/images/icon-mail.png"/></a> 
       </div> 
       <div class="six columns"> 
        <h5>CALL</h5> 
        <p>303.830.7272<br /> 
        303.832.8282</p> 
       </div> 
       <div class="five columns omega"> 
         <h5>GET TO US</h5> 
         <p>1332 East Colfax Ave<br /> 
         Denver, CO 80218 | <a href="http://goo.gl/fVpC4" target="_blank"> Map</a> 
         </p> 
       </div> 
      </div> 
     </div><!--container--> 
    </div> 

    <div class="full left bottom-footer-bg"> 
     <div class="container"> 
      <div class="sixteen columns"> 
       <p class="bottom-footer-text">&copy; <?php echo date('Y'); ?> Bound By Design Tattoo | Site by <a href="http://brentthelendesign.com" target="_blank">brentthelendesign</a></p> 
      </div> 
     </div> 
    </div> 
</footer>  

<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri();?>/javascripts/plugins.js"></script> 
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri();?>/javascripts/nav.js"></script> 
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri();?>/javascripts/script.js"></script> 

<?php wp_footer();?> 
</body> 

Answer 1

в style.css, пожалуйста, добавьте этот CSS вы используете ширину 100%, а также применение отступов, что у его происходит

.bottom-footer-bg,.home-posts-bg,.secondary-bg{ 
width:100%; 
-moz-box-sizing:border-box; 
-webkit-box-sizing:border-box; 
box-sizing:border-box; 
} 

Answer 2

Если вы можете использовать css3, вы можете использовать размер окна на нижнем колонтитуле. У вас есть ширина 100% набора и дополнение к этому. Попробуйте:

.full { 
    box-sizing: border-box; 
}