Html 减小航向h1和边界之间的距离？

我试图减少h1元素中的文本和右边边框之间的距离，使其看起来像一条小的垂直线，将其与下面的文本分开

这就是我当前的css的样子：

.test{
   border-right: 2px solid black;
   padding-right: 0px;
}

右边的边框仍然显示在离右边很远的地方，尽管我认为通过将右边的padding设置为0px，它应该直接显示在文本旁边

我想这是一个相当愚蠢的问题，我还是一个初学者

---

提前感谢

h1元素默认为

显示：块

，默认为100%宽度。尝试更改

width:300px

或

display:inline block
h1
元素默认情况下为
display:block
（宽度为
width:100%
），这意味着它们会延伸到容器的全宽

如果希望元素的宽度仅为所需的宽度，请将其改为
display:inline block
（然后使用填充，如您所确定的，以确定文本结尾与右边框之间的距离）：


.test{
右边框：2倍纯黑；
右边填充：0px；
显示：内联块；
}
这是一个测试
尝试更改
h1
的宽度。尽管你可能认为这是一个愚蠢的问题，但至少你问得很恰当。我只是想发泄一下。今天有些这样的东西