Php 页面水平滚动的问题

我有一个问题，这个页面在x轴上有额外的空间，不知道为什么。我也搜索了这个论坛的答案，但没有找到任何适用的答案，所以如果有什么我忽略了的地方，我道歉。我重新检查了我的HTML结构，看看是否有任何未关闭的div，但没有看到任何内容。有人有什么想法吗？以下是Wordpress的结构：

标题

<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>

>

循环页

<?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. ?>

本周最佳纹身
Lorem ipsum dolor sit amet，是一位杰出的献身者


珠宝
Lorem ipsum dolor sit amet，是一位杰出的献身者


善后
洛雷姆·伊普苏姆·多洛·希特·阿梅特，康塞特图·阿迪皮斯精英

如果您能够使用css3，那么可以在页脚上使用框大小。你有一个100%的宽度设置和一个填充上面。尝试：

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

在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;
}

这将干扰其他100%且不使用填充的项目对齐其他项目也使用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;
}