背景height100%问题

设计稿

 

刚拿到这个图时，想到这中间部分用

<div class="Separated fl" ><div></div></div>

css:

 

 

.VSbox .Separated{ background:url(../images/bg/VSLinebg.gif) 0 0 repeat-y; width:38px;  height:100%;}
.VSbox .Separated div{ background:url(../images/bg/VSbg.gif) 0 0 no-repeat; height:38px;}

以100%显示div；这样的话，父容器就必须设置高度了，这样很有局限性

 

不如在整个大的div里设置竖线背景，就能实现以上效果，而且可以增加和减少内容

.VSbox{ background:url(../images/bg/VSLinebg.gif) center 0 repeat-y #ededed;}

 

.VSbox .Separated{background:url(../images/bg/VSbg.gif) 0 0 no-repeat; height:38px; height:190px}