所以我在我的一个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 & Hours" href="/ontario/rates_hours.php">Rates & Hours</a></li>
<li><a title="Get Directions to Scandia" href="/ontario/directions.php">Directions</a></li>
<li><a title="Rides, Games, & 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">© 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而没有运气。
截图:
答案 0 :(得分:0)
所以我找到了一个修复程序,不确定它是否是最好的方法,但它确实有效。我在HTML中验证了一堆问题,但这并没有摆脱它。我在所有div周围放置了边框,发现导致间隙的div。然后我删除了div中的所有内容,发现它仍然有高度(等于间隙的大小。所以在CSS中我将div高度设置为0.这摆脱了差距,然后我只需要重新设置我的CSS中的一些东西,使一切看起来都像它的方式,它的工作。
如果您查看我的原始帖子,导致问题的div是footer#ont_foot
。