文本框下方的 HTML 边框

Question

如何使底部边框正好位于文本框下方？

div {
  border-bottom: solid 2px #354458;
}
p {
  color: #ffffff;
  background-color: #354458;
  text-align: center;
  padding: 8px 10px 5px 10px;
  font-weight: bold;
  font-size: 12px;
  letter-spacing: 1px;
  width: 190px;
  font-family: 'Courier New', courier, monospace
}

<div>
  <p>How do I remove the margin below here?</p>
</div>

Answer 1

p 标签默认会有一些边距。将其设为零，以便边框贴在底部。

添加了margin-bottom:0px;

div {
  border-bottom: solid 2px #354458;
}
p {
  color: #ffffff;
  background-color: #354458;
  text-align: center;
  padding: 8px 10px 5px 10px;
  font-weight: bold;
  font-size: 12px;
  letter-spacing: 1px;
  width: 190px;
  font-family: 'Courier New', courier, monospace;
  margin-bottom:0px;
}

<div>
  <p>Margin from below this has been removed!!</p>
</div>