如何在容器的100％处CSS垂直线

Question

我的页面中央有一条垂直线。但我希望线条与垂直线div所在的容器完全一致。当我使用高度：100％;在垂直线div上，线条只能达到我的显示器分辨率高度的大小。这是该行的CSS：

.line {        
border-left: 6px solid  #3C948B;
margin-left: -3px;
height: 100%;
position: absolute;
left: 50%;        
z-index:-5;}     

Answer 1

保持线的容器需要具有定义的高度：

div {
  height: 2000px;
}
.line {        
border-left: 6px solid  #3C948B;
margin-left: -3px;
height: 100%;
position: absolute;
left: 50%;        
z-index:-5;}

<div>
<span class="line"></span>
</div>

Answer 2

当您使用百分比高度时，您还必须检查父高度。然后是父母的父亲等的高度。这可能意味着你需要在你的height: 100%标签上添加一个html, body。并且可能对你下面的任何包装。