javascript/css绝对位置div

Question

我得到了这个PSD设计我需要代码为HTML，它有一个浏览器窗口（左侧和右侧）下一个和上一个导航按钮的幻灯片，所以我想你可以只是为两个div执行CSS position: absolute，其中一个为left: 0;和其他到right: 0;但他们会留在浏览器屏幕顶部的两侧，并根据设计，他们必须在浏览器屏幕垂直高度的中间。所以，我的意思是基本上例如，使用的jsfiddle：http://jsfiddle.net/ZVL8W/把这些块：

而且他们这样的位置：

所以我想会有可能的JavaScript包括在内，因为这些div将里面的一些深度div结构具有设置的宽度，所以幻灯片控制div会以某种方式需要能够从父容器的设置宽度中移出。

Answer 1

检查了这一点：http://jsfiddle.net/ZVL8W/3/
这有相同的高度，无论屏幕尺寸是什么。

.left-box { 
     width: 100px; 
     height: 100px; 
     background-color: red; 
     display: block; 
     position:absolute; 
     top:50%; 
     left:0px; 
     margin-top:-50px; 
    } 
    .right-box { 
     width: 100px; 
     height: 100px; 
     background-color: blue; 
     display: block; 
     position:absolute; 
     top:50%; 
     right:0px; 
     margin-top:-50px; 
    } 

Answer 2

您可以通过CSS做这一切：http://jsfiddle.net/ZVL8W/7/

.left-box { 
    width: 100px; 
    height: 100px; 
    background-color: red; 
    display: block; 
    position:absolute; 
    top:50%; 
    margin-top:-50px; 
    left:0; 
} 
.right-box { 
    width: 100px; 
    height: 100px; 
    background-color: blue; 
    display: block; 
    position:absolute; 
    left:100%; 
    margin-left:-100px; 
    top:50%; 
    margin-top:-50px; 
}