задачка для верстальщиков

Можно попробовать выровнять высоту колонок с помощью отступов: заведомо большим паддингом и таким же, только отрицательным маргином.

#content,

#sidebar {

  padding-bottom:32767px;

  margin-bottom:-32767px;

}

А чтобы не выводилась длинная страница, нужно обрезать её с помощью overflow:hidden. Подробнее об этом способе можно почитать здесь (раздел "высота колонок"). Если у колонок будет одинаковая высота, то поместить картинку в нужное место, я думаю, не составит труда.

да, спасибо. Это я уже делал. Это подойдет для задачи, когда нужно сделать одинаковую высоту у колонок.

Но сейчас задача, чтобы поместить картинку в самый низ левой колонки. Т.е. если бы было на таблицах, то можно было бы задать valign: bottom. Но как на дивах?

Пробовал абсолютным позиционированием с привязкой к низу контейнера. Но тогда возникает ситуация, что когда мало текста и меню, то картинка наезжает на меню. Атрибуты min-height не все браузеры читают.

ну емаё.. под меню засунь пустой див с высотой минимальной.. на вскидку там HEIGHT: 300px и все.. :)

если под меню засуну див - то он и будет под меню. А нужно чтобы был в самом низу, причем зависимо от правой колонки

Раз картинка снизу, то можно её пристроить после обеих колонок, а потом закинуть поверх колонок отрицательным маржином.

так тоже уже делал. Но проблема в том, что если в меню или в правой колонке будет мало текста, то картинка будет наезжать на меню или же болтаться прям под ним. А нужно, чтобы независимо от текста соблюдалась какая-то минимальная высота. Короче, может кто знает. Можно ли каким то образом прикрутить атрибут min-height для IE. Можно правда изображением распоркой, но лучше кодом бы каким-то..

Можно использовать хак для IE. Вот пример:

.block {

    min-height: 200px;

}

* html .block {

    height: 200px;

}

height для 5й и 6й версий IE ведет себя как min-height. другие способы

может я не совсем понял, но если надо поместить картинку в нижнюю часть дива

background-image: url('mybg.gif'); /* Путь к фоновому рисунку */

background-position: right bottom; /* Положение фона */

Одновременно можно и цвет задать плюсом к картинке.

Более подробно Удобный справочник и не делеко :)

.block {

    min-height: 200px;

}

* html .block {

    height: 200px;

}

Видимо нужно будет совместить эти два способа и получится то, что нужно. Первым - я сделаю минимальную высоту, а вторым - поместим вниз картинку. Пошел думать и делать. Отпишусь попозже

То что вам нужно делается так, допустим у вас такой код (колонки и обертка)

<div class="mywonderfulWRAPPER>



<div class="coolLEFTCOLUMN"></div>



<div class="terrificRIGHTCOLUMN"></div>



<div class="BOTTOMDIV"></div>



</div>

Тогда вот такой ЦСС поможет вам

/*стили для лейаута*/

.mywonderfulWRAPPER{

width:100%;overflow:hidden;position:relative;

}

.terrificRIGHTCOLUMN{float:right:width:500px;}

.coolLEFTCOLUMN{float:left;width:200px;}



/*Стили для решения задачи*/

.coolLEFTCOLUMN{padding-bottom:200px} /*освобождаем место для нижнего блока*/

.BOTTOMDIV{position:absolute;bottom:0;left:0;height:200px;width:200px} /*засовываем наш див куда нужно*/