html - 流体和固定布局

Question

如何并排放置 2 个 div，一个 div 的宽度为 75%，另一个为 25% 宽度。另外一个 div，margin:0 auto; 在它的顶部，以使内容位于页面中心，宽度为：986px；

请看下面的代码

#bodywrapper
{
margin:0 auto;
}
#green-portion
{
background:url('images/green_portion.png') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    width:75%;
    position:absolute;
    top:30%;
    bottom:0;
    left:0;
    right:0;
    overflow:hidden;
    z-index:-1;
    display:none;
}
#blue-portion
{
    width:25%;
    background-color:#051f3b;
    height:400px;
    position:absolute;
    top:30%;
    bottom:0;
    left:75%;
    right:0;
    overflow:hidden;
    z-index:99999;


    }
<div id="bodywrapper">



<div id="green-portion">
</div>

<div id="blue-portion">
</div>

</div>

Answer 1

#bodywrapper {
 margin:0 auto;
}
#green-portion {
    background:#00CC00; 
    width:75%;
    height:400px;       
    top:30%;
    float:left; 
}
#blue-portion {
    width:25%;
    background-color:#051f3b;
    height:400px;   
    top:30%;
    float:right;
}
<div id="bodywrapper">
  <div id="green-portion"></div>
  <div id="blue-portion"></div>  
</div>

Answer 2

的CSS；

#blue-portion {
     float: right;
}