如何阻止边框底部宽度重叠/溢出到float-right div

Question

带边框的h1：

h1 {
  font-size: 2.125em;
  border-bottom: 1px solid #aaa;
  width: 100%;
  display: block;
}

浮动右边＆＃34;内容＆＃34;：

div {
  float: right;
  clear: right;
  margin-bottom: .5em;
  padding: .5em 0 .8em 1.4em;
  background: transparent;
  max-width: 20em;
}

如何删除向右穿过内容部分的线条？

Answer 1

如果要删除内容开始的行，只需将background: #fff;添加到内容div样式即可 如果边界底部必须只在＆＃34;规则＆＃34;和＃34;字符设置＆＃34;您可以使用text-decoration: underline;代替border-bottom: 1px solid #aaa;或将每个h1包装在div中并添加到包装的h1 display: inline-block;