页面右侧的空白答案

【问题标题】：White space on right side of page页面右侧的空白
【发布时间】：2018-03-19 16:53:02
【问题描述】：

我的网页右侧有多余的可用空间问题。这是我的网页：

我添加了这些代码

html,body
{
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden; 
}

它解决了我的问题，但是它禁用了网页上的页脚图标，我该怎么做呢？

这是网页：

webpage url

【问题讨论】：

您的footer div class"=row" 标签不在container 标签内
在</footer>标签关闭之前关闭container div
stackoverflow.com/questions/46012482/…检查这个答案可能对你有帮助

标签： html css responsive-design

【解决方案1】：

您的 HTML footer > container 结束标记中有错误

修改了另一个错误

//1: header mistake - Position  
//the problem is position: relative in header media query on the theme-styles.css

   .header @media (max-width: 768px){
     /* position: relative; */ /*remove this*/
        animation: none !important;
        padding: 0px 0;
    }

//2: footer mistake - container closing tag
    <footer id="site-footer" class="footer ">
       <div class="container">
            //container closed here
       </div>//remove this close tag
           <div class="row>"---</div>
           <div class="sub-footer large">---</div>

      </div>//container close here
   </footer>

【讨论】：

好的，我改变了这个，但它已经在那里了。这些代码不会改变
我已经使用您链接的web page 检查了错误。通过检查它的工作
我知道它看起来很有效，但是在手机中，空白已经存在。
我检查了问题出在您的标题部分
删除.header (max-width: 570px){--} 上theme-styles.css 文件中的position:relative 属性

【解决方案2】：

其中一个元素导致了该边距。要找出你可以将所有元素的轮廓边框设置为 1px 红色，然后修复它。

*{
 outline: 1px solid red;
}

【讨论】：

我是网络开发的初学者，您的建议对我帮助很大。谢谢。

【解决方案3】：

不要添加此代码，而是需要更正页脚部分中的 HTML 代码。实际上它看起来像这样

<footer id="site-footer" class="footer ">
  <div class="container">
  </div> <!-- issue here !!-->
  <div class="row" itemscope="" itemtype="http://schema.org/Organization">
    <div class="contacts">
      <div class="col-lg-4 col-md-6 col-sm-12 col-xs-12">
        <div class="contacts-item">

        </div>
      </div>
    </div>
  </div>
</footer>

container的div关闭不好，应该在rowdiv之后关闭。这就是为什么你有空白，因为行类添加了由容器纠正的负边距。

【讨论】：

好的，我改变了这个，但它已经在那里了。这些代码不会改变
我仍然看到问题