网站边缘和页脚之间的空间

Question

我似乎无法删除页脚和网站之间的这个小空间。仅当屏幕大小调整为小于 width:500px; 时才会显示该空间。

http://imgur.com/a/mNhgN

<footer class="footer">
            <div class="left-side">
                <div>
                    <a href="#">Back to top</a>
                </div>
                <p>Loo Inc &copy; 2016</p>
            </div>
            <div class="middle">
                <div>
                    <h3>Social Media</h3>
                    <img src="images/icons/facebook.png" alt="facebook social media icon"> <a href="https://www.facebook.com/TheLooApp/" target="_blank" alt="link to our facebook profile.">facebook.com </a> <br/>
                    <img src="images/icons/twitter.png" alt="twitter social media icon"> <a href="https://www.twitter.com/TheLooApp" target="_blank" alt="Link to our twitter profile.">twitter.com</a> <br/>
                    <img src="images/icons/instagram.png" alt="instagram social media icon"> <a href="https://www.instagram.com/TheLooApp" target="_blank" alt="Link to our instagram profile.">instagram.com </a> <br/>
                </div>
                <div style="margin-top:20px;">
                    <p>E-mail us at: <a href="mailto:support@company.com">loo@mail.com</a></p>
                </div>
            </div>
            <div class="right-side">
                <p class="our_services">
                    <h3> Payment methods </h3>
                    <img src="images/icons/mc.png" alt="Icon with MasterCard logo. ">
                    <img src="images/icons/visa.png" alt="Icon with Visa logo.">
                    <img src="images/icons/paypal.png" alt="Icon with PayPal logo.">
                    <img src="images/icons/vipps.png" alt="Icon with Vipps logo.">
                </p>
            </div>
        </footer>

https://jsfiddle.net/4hxe30er/

Answer 1

仅使用 html 结构的一小部分来调试代码是很困难的，但从 JSFiddle 中，您应该能够通过删除 @media (max-width: 50em) { } 中的 margin-bottom: 40px; 行来解决这个问题。