什么 CSS 元素会将隐藏的 div 显示为空白？

Question

在我的 Wordpress 网站上，Leaflet Maps Marker 插件会显示位置地图。在源代码中，每个地图位置标志都定义在 DIV 标签内，例如

<div id="lmm_geo_tags_4c74453a_14" class="lmm-geo-tags geo">Brewery Lane: <span class="latitude">53.346031</span>, <span class="longitude">-6.263213</span></div>

DIV 标签在页面源代码中可见，但在页面上显示为空白行，从而在地图下方创建大量空白：http://www.glutenfreeireland.com/test-map/

插件作者一直未能找到解决方案 (http://wordpress.org/support/topic/space-or-gap-between-map-and-marker-list)，主题开发人员回复了支持电子邮件，称这不是由主题引起的。

是否有 CSS 元素会将 DIV 标签显示为空格或其他与之冲突的元素？地图页面是唯一出现此问题的页面。

Answer 1

仔细看看，你把它包裹在一个

中

<pre> 

导致此问题的标签。

如果我将您的标签更改为 div，一切都很好。

Answer 2

如果您在隐藏的<div> 元素仍然在地图下方生成空间时遇到问题，您可以随时尝试调整地图容器的高度。

<div id="lmm_ec964ab4" style="height: 625px" class="mapsmarker layermap layer-1">
  ...
  <div id="lmm_geo_tags_ec964ab4_1" class="lmm-geo-tags geo">
  ...
</div>

通过将 height 样式添加到 <div> 和 .mapsmarker 类中，您可以控制内容及其框的高度，以便 .lmm-geo-tags 元素的溢出被隐藏了。