2ух-колоночная страница

[MaSoGg]

делал по уроку на этом сайте

при создании 2ух колонок правая колонки ниже левой

article { /* Левая колонка */

margin-right: 240px; /* Отступ слева */

}

видимо из-за margin-right правая колонка опускается

как исправить?

p.s. выравнивание правой колонки идет ниже контента в левой колонке ,т.е если убрать контент в левой колонке ,то колонки будут на одном уровне

.content-gradient {

background: #fff url(images/content-gradient.png) repeat-x;

}

.content-bg {

width: 960px; /* Ширина макета */

margin: auto; /* Выравнивание по центру */

background: #fff no-repeat; /* Фон с границами */

}

.content-white {

background: #fff; /* Белый цвет фона */

margin: 0 11px; /* Отступы по горизонтали */

padding: 20px 40px; /* Поля */

text-align: justify; /* Выравнивание по ширине */

}

aside { /* Правая колонка */

width: 200px; /* Ширина правой колонки */

float: right; /* Обтекание */

}

article { /* Левая колонка */

margin-right: 240px; /* Отступ слева */

}

<div class="content-gradient">

<div class="content-bg">

<div class="content-white">

<article>

<p>Перед вами учебный сайт для демонстрации возможностей HTML и CSS по

созданию своего ресурса и его публикации в Интернете. Поскольку

любой сайт должен содержать полезную или интересную информацию. Так, на всякий случай.</p>

</article>

<aside>

Правая колонка!

</aside>

</div>

</div>

</div>

[Nanto]

css обнулите! хотя бы так *{margin:0;padding:0;}

и обтекаемый элемент должен ставиться впереди того контента, который его должен обтекать (независимо справа или слева)!

Т.е. в Вашем случае <aside> поставить выше <article> (иначе к правому-то краю он прижмётся, но обтекать его будет нечему - контент из <article> уже будет выведен на страницу). Ну и обнулить css...

[hedgehog]

aside и article местами поменяйте. либо укажите article ширину, уберите правый отступ и задайте float: left. это позволит выводить articles раньше aside (ширина фиксированная, судя по примеру)

Edited November 10, 2011 by hedgehog

[MaSoGg]

спасибо ,проблему уже решил)

Edited November 10, 2011 by MaSoGg