Html 表单输入，底部边框延伸到div的末尾，而不移动文本

试图将红线延伸到彩色div的末尾。
但如果我将宽度设为100%，它会将输入标记推到文本下方，有没有一种方法可以在没有单独宽度属性的情况下执行此操作

#联系人标题{
颜色：#838386；
字体大小：粗体；
}
.联络表格{
背景色：#b7dcd8；
保证金权利：30%；
填充：2%0.2%；
字体系列：衬线；
字号：12号；
}
.formtitle{
边界：无；
}
.forminput{
边界：无；
底部边框：2倍纯红；
背景色：#b7dcd8；
}

联系我们
名字：


您的电子邮件：


确认电子邮件：


联系电话：


主题：



您的查询：





请勾选表示您希望加入我们的邮件列表

在段落上使用定位伪元素

#联系人标题{
颜色：#838386；
字体大小：粗体；
}
.联络表格{
背景色：#b7dcd8；
保证金权利：30%；
填充：2%0.2%；
字体系列：衬线；
字号：12号；
}
.formtitle{
边界：无；
位置：相对位置；
溢出：隐藏；
/*必需的*/
}
.formtitle：：之后{
内容：''；
宽度：100vw；
高度：0px；
底部边框：2倍纯红；
位置：绝对位置；
底部：1px；
}
.forminput{
边界：无；
底部边框：2倍纯红；
背景色：#b7dcd8；
}

联系我们
名字：



您的电子邮件：



确认电子邮件：



联系电话：



主题：




您的查询：






请勾选表示您希望加入我们的邮件列表

在段落上使用定位伪元素

#联系人标题{
颜色：#838386；
字体大小：粗体；
}
.联络表格{
背景色：#b7dcd8；
保证金权利：30%；
填充：2%0.2%；
字体系列：衬线；
字号：12号；
}
.formtitle{
边界：无；
位置：相对位置；
溢出：隐藏；
/*必需的*/
}
.formtitle：：之后{
内容：''；
宽度：100vw；
高度：0px；
底部边框：2倍纯红；
位置：绝对位置；
底部：1px；
}
.forminput{
边界：无；
底部边框：2倍纯红；
背景色：#b7dcd8；
}

联系我们
名字：



您的电子邮件：



确认电子邮件：



联系电话：



主题：




您的查询：






请勾选表示您希望加入我们的邮件列表

最好为输入设置标签元素。 如果您希望您的输入也是100%，而不仅仅是边框，您可以使用display:table

#联系人标题{
颜色：#838386；
字体大小：粗体；
}
.联络表格{
背景色：#b7dcd8；
保证金权利：30%；
填充：2%0.2%；
字体系列：衬线；
字号：12号；
}
.formtitle{
边界：无；
}
.forminput{
边界：无；
底部边框：2倍纯红；
背景色：#b7dcd8；
显示：表格单元格；
宽度：100%；
}
.formtitle{
显示：表格；
宽度：100%；
}
.标签文本{
显示：表格单元格；
宽度：10%；
空白：nowrap；
}

联系我们

您的电子邮件：
确认电子邮件
主题：
您的查询：





请勾选表示您希望加入我们的邮件列表

最好为输入设置标签元素。 如果您希望您的输入也是100%，而不仅仅是边框，您可以使用display:table

#联系人标题{
颜色：#838386；
字体大小：粗体；
}
.联络表格{
背景色：#b7dcd8；
保证金权利：30%；
填充：2%0.2%；
字体系列：衬线；
字号：12号；
}
.formtitle{
边界：无；
}
.forminput{
边界：无；
底部边框：2倍纯红；
背景色：#b7dcd8；
显示：表格单元格；
宽度：100%；
}
.formtitle{
显示：表格；
宽度：100%；
}
.标签文本{
显示：表格单元格；
宽度：10%；
空白：nowrap；
}

联系我们

您的电子邮件：
确认电子邮件
主题：
您的查询：





请勾选表示您希望加入我们的邮件列表

谢谢。这很好用，主题标签因为我放置了
标签而关闭了谢谢。这是完美的作品，主题标签是关闭的，只是因为我的位置<