html - 我无法让我的内容在右框中垂直居中

Question

我有一个左右两侧的网站。但是我无法将正确框的内容集中在正确的框中。

我不能真正更改容器 css，因为那样整个站点都会崩溃，因为该站点是使用 Jquery 构建的。但现在我无法让我的内容框在 RIGHT 框中垂直和水平居中。

jsFiddle:http://jsfiddle.net/ndEXN/

HTML

<!-- LEFT -->
<div id="left">
<div id="t_content">
<div id="t_container">

<div id="t1_b1">Random title I</div>
<div id="t1_b2">Random text I</div>

</div>
</div>
</div>

<!-- RIGHT -->
<div id="right">
<div id="f_content">
<div id="f_container">

<div id="f1_b1">Random title II</div>
<div id="f1_b2">Random text II</div>

</div>
</div>
</div>

CSS

html,body {
    padding:0;
    margin:0;
    height:100%;
    min-height:100%;
    overflow: hidden;
}
#left {
    width: 50%;
    height: 100%;
    background-color: #6e0e10;
    float: left;
    cursor: pointer;
    position: absolute;
    overflow:hidden
}
#t_container {
    position:absolute; 
    top:0; 
    bottom:0; 
    left:0; 
    right:0;
    margin:auto; 
    height:120px; 
    width:600px;
}
#t1_b1 {
    background: #000000;
    opacity: 0.95;
    color: #FFF;
    width: 105px;
    height: 50px;
    margin-bottom: 10px;
    float:left;
    margin-left: 247px;
}
#t1_b2 {
    background: #000000;
    opacity: 0.95;
    color: #FFF;
    width: 400px;
    height: 50px;
    margin-bottom: 10px;
    float:left;
    margin-left: 100px;
}
#t_content {
    margin-left: auto;
    margin-right: auto;
    width: 600px;
    height: 100%;
}
#right {
    width: 50%;
    height: 100%;
    background-color: #130e6e;
    background-position: right;
    float: right;
    cursor: pointer;
    overflow: hidden;
}
#f_container {
    position: absolute;
    margin: auto;
    height:120px; 
    width:600px;
}
#f1_b1 {
    background: #000000;
    opacity: 0.95;
    color: #FFF;
    width: 105px;
    height: 50px;
    margin-bottom: 10px;
    float:left;
    margin-left: 247px;
}
#f1_b2 {
    background: #000000;
    opacity: 0.95;
    color: #FFF;
    width: 400px;
    height: 50px;
    margin-bottom: 10px;
    float:left;
    margin-left: 100px;
}
#f_content {
    margin-left: auto;
    margin-right: auto;
    width: 600px;
    height: 100%;
}

Answer 1

需要添加bottom: 0;和顶部:0；到你的#f_container

#f_container {
position: absolute;
margin: auto;
height:120px; 
width:600px;
bottom:0;
top:0;
}