如何删除 HTML div 中的奇怪填充?
How can I remove a strange padding in my HTML div?
我正在使用 CSS 构建布局,自定义一些 'div' 标签。其中一个(ID 为 "col3" 的 div)有一个奇怪的 padding-top,我不知道为什么。我已经尝试使用 'padding: 0;',但它不起作用。我知道我可以用 属性 'position' 修复它,但为什么我的 div 会出现这种情况?代码如下:
HTML
<section id="getintouch">
<h3>Get in Touch</h3>
<p>Etiam at mi at quam suscipit auctor a ac urna. Nullam non euismod felis, sed rhoncus risus. Donec erat enim, convallis eu facilisis at, hendrerit sed ligula.</p>
<div id="getintouchlayout">
<div id="col1-2">
<form action="#" method="POST">
<label for="name">Name</label>
<input type="text" name="nome" id="name">
<label for="email">Email</label>
<input type="email" name="email" id="email">
<label for="message">Message</label>
<textarea name="message" id="message"></textarea>
<input type="submit" value="Send Message">
</form>
</div>
<div id="col3">
<address>
<p>
<span>Endereço</span>
1234 Somewhere Rd. Nashville, TN 00000 United States
</p>
<p>
<span>Telefone</span>
000-000-000
</p>
<p>
<span>Email</span>
email@server.com
</p>
</address>
</div>
</div>
</section>
CSS
#getintouchlayout{overflow: auto;}
#col1-2{
width: 63.5%;
margin-right: 5%;
float: left;
}
#col3{
width: 31.5%;
float: right;
}
Obs:我知道 'float' 不太习惯这样做,但我正在使用它,因为我正在学习这个 属性 在一门课程中,我需要在一个项目中使用它.
删除 <p>
边距,该标签具有 <label>
没有的固有填充。
我正在使用 CSS 构建布局,自定义一些 'div' 标签。其中一个(ID 为 "col3" 的 div)有一个奇怪的 padding-top,我不知道为什么。我已经尝试使用 'padding: 0;',但它不起作用。我知道我可以用 属性 'position' 修复它,但为什么我的 div 会出现这种情况?代码如下:
HTML
<section id="getintouch">
<h3>Get in Touch</h3>
<p>Etiam at mi at quam suscipit auctor a ac urna. Nullam non euismod felis, sed rhoncus risus. Donec erat enim, convallis eu facilisis at, hendrerit sed ligula.</p>
<div id="getintouchlayout">
<div id="col1-2">
<form action="#" method="POST">
<label for="name">Name</label>
<input type="text" name="nome" id="name">
<label for="email">Email</label>
<input type="email" name="email" id="email">
<label for="message">Message</label>
<textarea name="message" id="message"></textarea>
<input type="submit" value="Send Message">
</form>
</div>
<div id="col3">
<address>
<p>
<span>Endereço</span>
1234 Somewhere Rd. Nashville, TN 00000 United States
</p>
<p>
<span>Telefone</span>
000-000-000
</p>
<p>
<span>Email</span>
email@server.com
</p>
</address>
</div>
</div>
</section>
CSS
#getintouchlayout{overflow: auto;}
#col1-2{
width: 63.5%;
margin-right: 5%;
float: left;
}
#col3{
width: 31.5%;
float: right;
}
Obs:我知道 'float' 不太习惯这样做,但我正在使用它,因为我正在学习这个 属性 在一门课程中,我需要在一个项目中使用它.
删除 <p>
边距,该标签具有 <label>
没有的固有填充。