html - 如何避免css中的文本和地图重叠?
问题描述
我正在一个网站上工作,我在该网站上创建了一张地图,计算与当前位置的距离。地图工作正常。现在我想在下面添加一个文本,但由于某些原因它与地图重叠。
小提琴是http://jsfiddle.net/b0zcw415/4/embedded/result
问题陈述:
我想知道我需要在 css 代码中进行哪些更改,无论我在地图下方添加的任何文本都不应重叠。
我用来创建地图的 HTML 代码是:
<div id="outer">
<p id="distance_text"></p>
<input type="text" name="location" value="Current Location">
<br>
<div id="map_div"></div>
</div>
解决方案
问题是由于您的 CSS 告诉文本距离元素顶部 50 像素#outer
。
在 CSS 选择器中更改以下行#outer
:
#outer {
width: 400px;
/* height: 50px; */
margin: 0 auto;
text-align: center;
}
推荐阅读
- app-store - Safari 扩展不再在调试模式下显示
- swift - TVOS topshelf 在模拟器上效果很好,而不是在电视上
- javascript - 以简单的方式使用纯 Javascript 淡入和淡出
- visual-studio - 项目脚本未保存在 Visual Studio 列表中
- python - 通过将日期列与两个参考列进行比较来计算从日期开始的年期
- google-cloud-platform - 我可以为 GCP 上的自定义角色分配的最大权限数是多少?
- c++ - 变量初始化 { } vs =
- sql - 如何在 SQL 中将 1 行拆分为多行
- javascript - 如何比较 2 个嵌套对象,减去差异并返回等于?
- amazon-web-services - Docker compose npm install 花了几个小时