比较元素相对于另一个元素

我有一个简单的html代码用于渲染数据库查询的输出,其中文本部分由行分隔:

____________________
 Title1 

blablablablablablablabla
____________________
 Title2 

blablablablablablablablablablablablablablablabla

如何自动调整这些行的长度,使它们与页面上最长的行一样长,如下所示:

________________________________________________
Title1 
blablablablablablablabla
________________________________________________
Title2
blablablablablablablablablablablablablablablabla

I am Monica.. 7

考虑通过发出

替换来更改标记.然后,您只需向标题条目添加顶部边框,而不是使用一堆下划线.如果你申请display: inline-block的

本身,它会崩溃到最宽项目的宽度.

dl {
  display: inline-block;  
}
dt {
  border-top: 1px solid #000;
  font-weight:bold;
}
dd {
  margin: 0;  
}

  
Title1
  
blablablablablablablabla
  
Title2
  
blablablablablablablablablablablablablablablabla
  

注意:我建议a,

因为它似乎更适合您的(虚拟)数据.也就是说,你当然可以像这样包装你的段落:

.wrapper {
  display: inline-block;        
}
.wrapper p {
  border-top: 1px solid #000;
}

  
Title1
blablablablablablablabla
  
Title2
blablablablablablablablablablablablablablablabla

1> I am Monica..：

---

考虑通过发出

替换来更改标记.然后,您只需向标题条目添加顶部边框,而不是使用一堆下划线.如果你申请display: inline-block的

本身,它会崩溃到最宽项目的宽度.

dl {
  display: inline-block;  
}
dt {
  border-top: 1px solid #000;
  font-weight:bold;
}
dd {
  margin: 0;  
}

  
Title1
  
blablablablablablablabla
  
Title2
  
blablablablablablablablablablablablablablablabla