gpt4 book ai didi

html - 如何阻止我的 'body' 吃掉我的 'foot'

转载 作者:可可西里 更新时间:2023-11-01 12:51:10 24 4
gpt4 key购买 nike

这是我的网站:http://mytestsite.nfshost.com/ .

如果您缩小浏览器窗口,您会注意到页面“body”标签中的内容覆盖了“footer”元素。相反,我希望它只是将“页脚”内容向下推而不将其吞没。

我该怎么做?

以下是 HTML 和 CSS 的相关部分。

<html>
<head>
-- HEAD CONTENT HERE --
</head>
<body>
<h1>U.S. Neighborhood Income Map</h1>
<h2>See how rich or poor every part of every city in America is</h2>
<div id="address-form-container">
<span id="form-pretext"> Enter a city name or address and pick a state (Or just a pick a state from the dropdown).</span>
<br>
<input id="address" type="textbox">
,
<select id="state-select">
<input type="button" value="Search">
<br>
<span id="note">(NOTE: If loading takes a while, try zooming in or out.)</span>
</div>
<div id="map-canvas" style="position: relative; background-color: rgb(229, 227, 223); overflow: hidden;">
-- MAP HERE --
</div>
<div id="below-map">
<p id="source-note" class="italics">
</div>
</body>
<footer>
<p id="contact">Please send all questions, comments, complaints, and suggestions to [EMAIL ADDRESS]</p>
</footer>
</html>

这是相关的 CSS

html {
float: right;
height: 100%;
text-align: center;
width: 100%;
}

body {
background:url(./images/bg.png);
height: 85%;
position: relative;
right: 8px;
width: 100%;

}

#map-canvas {
height: 75%;
margin-top: 5px;
width: 100%;
}

footer {
margin-top: 3em;
}

最佳答案

页脚必须在 body 标签内。

关于html - 如何阻止我的 'body' 吃掉我的 'foot',我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13735410/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com