Проблемы с двухколоночной вёрсткой

[PavelTkachev]

Сделал простой макет

<div><section></section><aside></aside></div>

Задал ему стили

            div{                max-width:957px;                margin:0 auto;            }            section{                height:200px;                background:green;                margin-right:200px            }            aside{                width:200px;                float:right;                height:200px;                background:red;            }

Но правая колонка почему-то находится под левой, а не справа от неё. Почему так?

Edited December 2, 2014 by PavelTkachev

[Aleksandr.L]

http://jsfiddle.net/y9de8rk5/

[PavelTkachev]

 

А почему?

А можно чтобы выглядело и работало также, но aside был после section?

[Aleksandr.L]

Потому что плавающий элемент должен быть перед элементом который будет его обтекать.

[PavelTkachev]

Как сделать, чтобы левый блок был резиновый, а правый фиксированной ширины. Но при этом, чтобы не было обтикания контентом правого блока, если в левом текста слишком много?

 

Я понимаю, что можно всё в таблицу поместить. Но не хочется.

 

Ещё я пробовал через inline-block. Но я не смог добиться резиновости только одного блока и чтобы при этом второй не проваливался вниз.

[Aleksandr.L]

Но при этом, чтобы не было обтикания контентом правого блока, если в левом текста слишком много?

 

Что? 

[PavelTkachev]

Ничего. Это я с дуру сболтнул...

[paralex]

после ваших слов представилось что-то такое http://jsfiddle.net/y9de8rk5/1/