我有浮动左和浮动右< div>嵌套在浅蓝色框div中，如下图所示。我不知道如何在它们之间插入一条垂直线(如下图所示：
http://screencast.com/t/0bRNOmjeE，因为我的sub-10声誉，所以SO不会让我嵌入)具有以下属性：
1)我可以控制或看起来合理的任何一侧的填充/边距(即，与其他div不太接近一个div)
2)如图所示留下上方和下方的边缘，即不延伸浅蓝色div的整个垂直宽度
3)当浏览器窗口越来越大，蓝盒大小随之增大/减小时，动态维护#1和#2
我正在寻找一个简单的，最好只有CSS的解决方案。
相关CSS：
#left {
position: relative;
float: left;
width: 44%;
margin: 0;
padding: 0;
}
#right {
position: relative;
float: right;
width: 49%;
margin: 0;
padding: 0;
}
#blue_Box {
position: relative;
width: 45%;
min-width: 400px;
max-width: 600px;
padding: 2%;
margin-left: 40%;
overflow: auto; /*needed so that div stretches with child divs*/
}
解决方法
使用div作为分隔线。无论左右的div高度相等，它都将始终垂直居中。您可以将其重用于您网站上的任何位置。
.divider{
position:absolute;
left:50%;
top:10%;
bottom:10%;
border-left:1px solid white;
}
检查工作示例在http://jsfiddle.net/gtKBs/
