Css 如何在内联块之后删除此空间？

我想不出这个空间是从哪里来的（在附图中用红色标记）？有什么建议吗

这是一个“即将到来”的页面，主要有一个报头和一个报脚，如果在手机或桌面上，一些社交链接的位置会有所不同。我的移动视图有问题

这是相关的HTML：

---

据我所知——在本例中，在桌面上，通过调整窗口大小使其与移动屏幕一样薄——这是因为您的内容不够高，无法填满屏幕

图片：

---

您的神秘空间只有

的高度，没有内容填充。

感谢您的关注！我想蓝色（考虑到这是响应性的）应该进一步向下，以缩小差距。在我的浏览器控制台（移动视图）中，蓝色延伸得更远，但仍然有巨大的空白。那么，如何进一步扩展蓝色呢？要获得一个粗略、简单的解决方案，请尝试将.masthead上的高度设置为80%。

<div class="masthead">
  <div class="masthead-bg"></div>
  <div class="container h-100">
    <div class="row h-100">
      <div class="col-12 my-auto">
        <div class="masthead-content text-white py-5 py-md-0">
          <h1 class="mb-3">Register</h1>
          <p class="mb-5">Building a X.
          We're building X for you. <strong>Request an invitation for early access using the form below!</strong></p>
          <form action="https://hen.us18.list-manage.com/subscribe/post" method="POST" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" target="_blank">
            <input type="hidden" name="u" value="377b993ba697354f6584371c9">
            <input type="hidden" name="id" value="e1c7ba1f4b">
            <div class="input-group input-group-newsletter">
              <input type="email" autocapitalize="off" autocorrect="off" name="MERGE0" id="MERGE0" size="25" value="" class="form-control" placeholder="Enter your email..." aria-label="Enter email..." aria-describedby="basic-addon">
              <div class="input-group-append">
                <button class="btn btn-secondary" type="submit">Notify Me!</button>
              </div>
                <input type="hidden" name="ht" value="f5b0455009025ab4743b2ecc932316028905c673:MTUzMTgyNjMzMC43NDM3">
                <input type="hidden" name="mc_signupsource" value="hosted">
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</div>



<div class="mastfoot">
      <div class="inner-mastfoot">
        &copy; 2018 X Ltd. All Rights Reserved. &nbsp;&nbsp;&nbsp;&nbsp; • 
    &nbsp;&nbsp;&nbsp;&nbsp; <a href="/legal">Legal</a> 
&nbsp;&nbsp;&nbsp;&nbsp; 
    • &nbsp;&nbsp;&nbsp;&nbsp; <a href="/contact">Contact</a>
      </div>
  </div>

<div class="social-icons">
  <ul class="list-unstyled text-center mb-0">
    <li class="list-unstyled-item">
      <a href="#">
        <i class="fa fa-envelope"></i>
      </a>
    </li>
    <li class="list-unstyled-item">
      <a href="#">
        <i class="fa fa-twitter"></i>
      </a>
    </li>
    <li class="list-unstyled-item">
      <a href="#">
        <i class="fa fa-medium"></i>
      </a>
    </li>
    <li class="list-unstyled-item">
      <a href="#">
        <i class="fa fa-linkedin"></i>
      </a>
    </li>
    <li class="list-unstyled-item">
      <a href="#">
        <i class="fa fa-instagram"></i>
      </a>
    </li>
    <li class="list-unstyled-item">
      <a href="#">
        <i class="fa fa-facebook"></i>
      </a>
    </li>
  </ul>
</div>