CSS float left не работает right

Question

Я пытаюсь разделить два деления на два раздела, левый и правый.Левый статичен (высота 300 пикселей), а правый не статичен (например, посты и комментарии).С нижним колонтитулом внизу.

<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>

Я сделал свой основной div с шириной 760 пикселей, следовательно, с этими настройками у меня еще осталось 10 пикселей.Теперь проблема в том, что я не могу назначить float-right для div с правым классом, и могу только назначить float-left для div с левым классом.Я пытался изменить div вверх и вниз, переназначая позиции, но я получаю не то, что хочу.Любая помощь?

edit

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>

Answer 2

вам нужно избавиться от некоторых div или присвоить плавающие родительские div'ы правого, левого divs.

<div> 
    <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 class="footer" style="clear: both;"><img src="images/members/ava/crays.jpg" style="width:760px; height:80px;" /></div> 
</div>

это должно работать.

Answer 3

Если вы сделаете измерения ширины правильно, вы можете получить этот макет, фактически плавая все влево.Ваш ордер div должен складываться правильно, и он, естественно, будет перемещаться туда, куда вы хотите.У вас есть больше div, чем необходимо.Обязательно убери это.