这些天我正在创建自己的投资组合,我想在其上添加一个联系表格。我试过了,但div与这样的页脚重叠。任何人都可以帮我解决这个问题吗?非常感谢。
#contactus {height: 105vh; margin:0 auto;}
#formContainer{ width: 85%; margin: 0 auto; background-color: aqua; }
.contactHead{ text-align: center}
<div id="contactus">
<div id="formContainer">
<h1 class="contactHead">Get In Touch!</h1>
<h4 class="contactHead">I will be with you within 24 hours</h4>
<form id="contactForm">
<input type="text" id="nameContainer" placeholder="Name">
<br>
<br>
<input type="email" id="emailContainer" placeholder="Email Address">
<br>
<br>
<input type="text" id="messageContainer" placeholder="Message">
<br>
<br>
<input type="submit" value="Send Message">
</form>
</div>
</div>
fV.png
检查这是否有帮助。
您的图片未加载。
#contactus {
position: relative;
z-index: 1;
}
#formContainer{ width: 85%; margin: 0 auto; background-color: aqua; }
.contactHead{ text-align: center}
.footer{
height:250px;
background-color:#1e1e1e;
text-align:center;
display:flex;
align-items:center;
justify-content:center;
}
.footer h2{
color: #fff;
}
<div id="contactus">
<div id="formContainer">
<h1 class="contactHead">Get In Touch!</h1>
<h4 class="contactHead">I will be with you within 24 hours</h4>
<form id="contactForm">
<input type="text" id="nameContainer" placeholder="Name">
<br>
<br>
<input type="email" id="emailContainer" placeholder="Email Address">
<br>
<br>
<input type="text" id="messageContainer" placeholder="Message">
<br>
<br>
<input type="submit" value="Send Message">
</form>
</div>
</div>
<div class="footer">
<h2>Footer</h2>
</div>