CSS浮动离开不正常

Question

我试图将两个div分成左右两个部分.左边的一个是静态的(300px高度)而右边的一个不是静态的(例如帖子和评论).底部有一个页脚.

<div>
    <div>
    <div class="right"><img src="images/members/bigava/crays.png" style="width: 630px; height: 130px;" /></div>
    </div>
    <div>
    <div class="left" style="float: left;"><img src="images/members/ava/crays.jpg" style="width:120px; height:80px;" /></div>
    </div>

我制作了一个宽度为760px的主div,因此在这些设置下,我还有10px备用.现在的问题是,我不能将float-right分配给具有右类的div,并且只能将float-left分配给具有左类的div.我尝试上下改变div,重新分配位置,但我得到的并不是我想要的.有帮助吗？

编辑

CSS
.right {
font-family: verdana;
font-size: 12px;
border-radius: 3px;
}

.left {
font-family: verdana;
font-size: 10px;
color: #000000;
border-radius: 3px;
}

这是我得到的结果,我不想要

我想要的是什么

Answer 1

DIV是一个块元素,所以你可以给你float或像inline-block你right div这样的实际width:

.right{float:right}

编辑:

在下面回答你的评论

如果你给float的divs,那么你必须clear its parent是这样的:

<div style="overflow:hidden"> 
    <div class="right" style="float: right;"><img src="images/members/bigava/crays.png" style="width: 630px; height: 130px;" /></div> 
    <div class="left" style="float: left;"><img src="images/members/ava/crays.jpg" style="width:120px; height:80px;" /></div> 
</div>