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），主题开发人员回复支持电子邮件说这不是由主题引起的。

是否存在将DIV标记显示为空格或其他与之冲突的元素的CSS元素？地图页面是此问题发生的唯一页面。

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>

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

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

2 个答案: