Столбы не совпадают

Question

Почему мои столбцы не выравниваются правильно? Кажется, что есть пробел выше. Есть далеко, что я могу сделать их автоматически установить ширину обертки ИТС 892px;

http://jsfiddle.net/pJefg/

HTML:

<div class="leftColParts"> 
    Text Left 
</div> 
    <div class="rightColParts"> 
    Text Right 
</div> 

CSS:

.leftColParts{ 
    width:215px; 
    background-color:red; 
} 
.rightColParts{ 
    float: right; 
    display: inline-block; 
    width:440px; 
    clear:both; 
    background-color: green; 
} 

Answer 1

ли это то, что вам нужно?

http://jsfiddle.net/pJefg/7/

HTML:

<div class="wrapper"> 
     <div class="leftColParts">Text Left</div><!-- 
    --><div class="rightColParts">Text Right</div> 
<div> 

-

CSS:

.wrapper { 
    width: 892px; 
} 
.wrapper:after { 
    clear:both; 
    content: "."; 
    height: 0; 
    visibility:hidden; 
} 
.leftColParts { 
    float:left; 
    width:215px; 
    background-color:red; 
} 
.rightColParts { 
    float:right; 
    width:440px; 
    background-color: green; 
} 

Answer 2

.leftColParts{ 
    width:215px; 
    background-color:red; 
    float: left; 
} 
.rightColParts{ 
    float: left; 
    width:440px; 
    background-color: green; 
} 

Попробуйте это.

В качестве альтернативы это:

.leftColParts{ 
    width:215px; 
    background-color:red; 
    display: inline-block; 
} 
.rightColParts{ 
    display: inline-block; 
    width:440px; 
    clear:both; 
    background-color: green; 
} 

Answer 3

я редактировал скрипку с тем, что я думаю, что это то, что вы хотите.

Что я сделал:

• плавали оба дивы оставили
• Добавлен Div с clearfix (clear: both;)

Вы можете проверить его здесь: http://jsfiddle.net/pJefg/2/