android - 我在移动浏览器上的 div 中的这个空间来自哪里？

Question

所以我的一个 div 中有一个奇怪的空间问题，但只有在 Android webkit 浏览器 533.1 上查看时才会出现(最新版本的 webkit android 浏览器没有这个问题)。该问题不会出现在其他任何地方，不会出现在桌面、较新的移动设备或浏览器上。等等。只有旧的 android 库存浏览器。

Here is the web page .有问题的 div 是带有电话号码和地址的 div(朝向屏幕底部，在 facebook 和 twitter 图标下方)。

我认为您去那里使用 firebug 查看代码会更容易，但如果需要，我可以在此处发布一些代码。只有大量的 css(多媒体查询)。

这是 div 的代码。间距出现在 div 中的第一个元素之前:

    <footer class="hideForDesktop" id="ont_foot">
     <div id="footer_div">
      <p id="number">909.390.3092 </p>
      <p> 1155 S. Wanamaker Ave, Ontario, CA 91761</p>


    <div id="bottom-mob-nav">
          <!-- navigation module -->
        <nav id="ontario_nav2">

    <ul>
        <li class="here"><a title="Scandia Home" href="/ontario/index.php">Home</a></li>
        <li><a title="Scandia Rates &amp; Hours" href="/ontario/rates_hours.php">Rates &amp; Hours</a></li>
        <li><a title="Get Directions to Scandia" href="/ontario/directions.php">Directions</a></li>
        <li><a title="Rides, Games, &amp; Fun" href="/ontario/attractions.php">Attractions</a></li>
        <li><a title="Throw Your Party at Scandia!" href="/ontario/parties.php">Parties</a></li>
        <li class="show"><a title="Bring your group party to Scandia" href="/ontario/group_events.php">Group Events</a></li>
      <li><a title="Educational tours at Scandia!" href="/ontario/education.php">Education</a></li>
        </ul>
      </nav>   
    </div>
    <div id="end">
    <p class="boring">&copy; 2014 Scandia Family Fun Center</p>
    <p class="boring">Prices, terms and conditions subject to change without notice. Some rides may be closed during inclement weather.</p>

    <div id="otherLocs">
        <ul>
            <li class="grey"><a href="http://www.scandiafun.com/ontario">Ontario</a></li>
            <li><a href="http://www.scandiafun.com/sacramento">Sacramento</a></li>
            <li><a href="http://www.scandiafun.com/victorville">Victorville</a></li>
        </ul>

    </div>

    <div id="other"><a href="#other">Other locations</a></div>
</div>
    </div>
            </footer>

我试过将 div#footer_div 高度设置为 auto 和 initial 但没有成功。

截图:

Answer 1

所以我找到了一个修复方法，不确定它是否是最好的方法，但它确实有效。我验证了 HTML 中的一堆问题，但并没有解决它。我在所有 div 周围放置了边框，并找到了导致间隙的 div。然后我删除了div中的所有内容，发现它仍然有高度(等于间隙的大小。所以在CSS中我将div高度设置为0。这摆脱了间隙，然后我只需要重新设计我的 CSS 中的一些东西使一切看起来像它一样并且有效。

如果您查看我的原始帖子，导致问题的 div 是 footer#ont_foot。