Html 如何在css中绘制两个分区之间的垂直线

我正在尝试创建两个分区，一部分包含图像，另一部分包含文本。我已经提供了我想要的图片，但是很抱歉，我不能在这里提供图片，因为我的声誉不足10。我需要至少10个声誉才能在这里发布图片，所以请转到评论框中提供的图片链接。我也提供了我尝试过的代码。因此，请任何人通过提供任何例子来提供帮助。我正在尝试这样的布局，我已经在评论框中提供了，请从评论框中检查，我在层叠样式表方面非常新，所以请帮助我。提前谢谢

到目前为止我的HTML:

<div class = "layer5 main">
    <h1>Features</h1>
    <DIV style="width: 50%; border-right: solid 2px lightgreen">
    </DIV>
</div>

特征

这就是我想要做的

这就是我目前所拥有的。

试试这个：

.layer5
{
文本对齐：居中；
边缘顶部：20px；
}
.firstSection{float:左；宽度：45%；}
.secondSection{浮动：左；宽度：45%；}
.seperator{width:5%；边框右侧：实心2px浅绿色；高度：25px；float:left；}

特点1
特点2

添加一些容器，然后在其中添加两个元素（块或表格单元格）。风格。就这些

垂直对齐有一个简单的解决方案

.layer5{
文本对齐：居中；
边缘顶部：20px；
}
.集装箱{
位置：相对位置；
显示：表格；
宽度：400px；
边框：0px实心#000；
}
.图像，
.文本{
显示：表格单元格；
垂直对齐：中间对齐；
文本对齐：居中；
边框：0px实心番茄；
填充：10px；
}
.形象{
宽度：200px；
}
.文本{
左边框：2倍纯红；
宽度：198px；
}
img{
宽度：100%；
身高：100%；
}

特征
Lorem ipsum dolor sit amet，奉献精英。大眼盲板。在福加·尤斯托的一个地方，有一个神圣的地方，那是一个巨大的城市，没有一个错误的劳动？

看看这个代码：

.layer5{
文本对齐：居中；
边缘顶部：20px；
}
.集装箱{
宽度：300px；
左边距：自动；
右边距：自动；
高度：120px；
显示：块；
}
#imgdiv-img{
宽度：100px；
浮动：左；
}
#textdivp{
左边框：2倍纯绿；
浮动：对；
左侧填充：50px；
}
#textdiv2p{
浮动：左；
右边框：2倍纯绿；
右边填充：50px；
左边框：无
}
#imgdiv2 img{
浮动：对；
宽度：100px；
}

特征
这是正文部分

这是正文部分

请分享您当前的代码。布局链接我正在尝试制作的内容以及我的代码链接我已经完成的内容请展示给我们您目前的成果。请阅读以改进您的问题。这不是重复的问题。我的问题不同。请仔细阅读是的，但我想在图像的右侧添加一些边距。我的意思是在图像和我想要的线条之间一些空间或间隙，那么我该怎么做呢？您添加了一个背景图像，而不是作为元素，如我的示例中所示。改变它。然后你可以设置图像的边距。为什么你删除了背景图像我有限制只使用背景图像这就是为什么我在那里使用了背景图像，所以请不要删除bg图像，我期待着，当然我会投票，但我仍然没有得到我期待的，中间线也太高了看，我期待着这样请参考这一点。中间线是我期望的句子高度不太高，就像属性的imageFor

。feat1

添加

背景位置：右30px中心

其中

30px

是背景右侧的位置，

背景重复：无重复。我想这就是你所需要的。是的，但我想在图像的右侧添加一些边距，我的意思是在图像和线条之间我想要一些空间或间隙，那么我该怎么做呢？@Archanghattande Lower
在
\textdivp
中向左填充
和
在
中向右填充
\textdiv2p
，例如，将它们设置为
30px
。是的，但我想在图像的右侧添加一些边距，我的意思是在图像和线条之间我想要一些空间或间隙，那么我该怎么做呢？可以使用float属性，然后使用padding right在两个div之间留出空间