在视图中间添加一条垂直线

Question

我需要在两个div之间添加一条垂直线。我使用bootstrap所以我有一个.col-md-12，然​​后我在里面有列，一个是.col-md-4（它有一个表单），另一个是.col-md-8（它有一张表。

所以它必须喜欢这个图像。

我尝试过使用hr并给它一个类，然后用90度旋转它，但它没有让我在底部添加空间。 我无法使用图像。

提前致谢！

Answer 1

您可以为中间div指定一个类名，然后像这样应用边框：

.middle{
  border-right: 1px solid #000;
  border-left: 1px solid #000;
}

对于一列div中的两列div，您可以在其中一列上应用border-right或border-left。

Answer 2

选择列的最高高度，并将border-right放在第一列的border-left到第二列，这取决于高度。

您设置图片的其他选项

<div class="row">
<div class="col-md-4">...</div>
<div class="col-md-1 hidden-xs divider"></div>
<div class="col-md-7"></div>
</div>

.divider{
background: url("img/divider.png") repeat-y;
}