Еще одна задачка

[lavr-ik]

<style>
#content:after { // чтобы родительский блок принимал высоту наибтольшего находящегося в нем ребенка
content: "";
display: block;
clear: both;
}

#content {
position: relative; // задаем относительное позиционирование, чтобы div.neighboor выравнивался относительного него
}

#left {
float: left;
width: 50%;
height: 300px; // в этом блоке выводятся статьи, поэтому высота может быть разной
}

#right {
float: right;
width: 50%;
}

#right div.garbage {
height: 100px; // здесь выводятся последние новости, поэтому высота тоже может быть разной
}

#right div.neighboor {
position: absolute;
bottom: 0;
}
</style>

<div id="content">
   <div id="left">
	  Some content here.
   </div>
   <div id="right">
	  <div class="garbage">
		 Some garbage.
	  </div>
	  <div class="neighboor">
		 Блок, который мне нужен.
	  </div>
   </div>
</div>

Необходимо сделать так, чтобы div.neighboor выравнивался по нижней границе #left. Сейчас это происходит, однако я никак не могу придумать, как заставить этот блок занимать все свободное место до div.garbage по высоте. Т.к. верстка, естественно, резиновая, при большом разрешении и фиксированной высоте div.neighboor получается, что величина вертикального отступа div.neighboor от div.garbage очень велика - появляется пустое пространство - некрасиво и неэстетично.

Хотелось бы решения на чистом CSS, без использования javascript (решения с его помощью не предлагать, уже есть

Всем заранее спасибо за внимание.

[psywalker]

Приведи скрин того, что должно получится, или дай ссылку с решением на JS, что-бы мы могли понять, что ты хочешь. И опиши подробнее, что ты хочешь получить

[mini]

Приведи скрин того, что должно получится, или дай ссылку с решением на JS, что-бы мы могли понять, что ты хочешь. И опиши подробнее, что ты хочешь получить

хотя бы в пайте нарисуй где какой блок должен быть

[lavr-ik]

Должно получиться так, как на рисунке: .neighboor должен по высоте занимать собой все свободное место до #right. Сейчас же получается так, что т.к. .neighboor имеет абсолютное позиционирование, ему абсолютно безразлично, какой высоты #right - он его перекрывает либо находится под ним (в зависимости от z-index, разумеется).

Необходимо добиться такого результата, чтобы .neighboor занимал собой все свободное пространство до #right по высоте, как на рисунке, вне зависимости от высоты #left, #right и самого .neighboor. Естественно, решение на Javascript элементарно, однако хотелось бы решения на чистом CSS.

Edited September 20, 2009 by lavr-ik

[psywalker]

Боюсь что с помощью CSS такую задачу решить не удасться, я по крайней мере точно его не знаю к сожалению и буду рад увидеть решение

[mishka]

непойму зачем блок абсолютом книзу прибивать, и при этом высоту ему растягивать. Тогда текст в нем тоже будет вверху. Так зачем абсолют?

Я так понял вам не по низу выравнивать блок надо, а просто эмулировать его высоту. Тоесть тянуть бекграунд к низу.

[psywalker]

непойму зачем блок абсолютом книзу прибивать, и при этом высоту ему растягивать. Тогда текст в нем тоже будет вверху. Так зачем абсолют?

Я так понял вам не по низу выравнивать блок надо, а просто эмулировать его высоту. Тоесть тянуть бекграунд к низу.

Вот если при таких раскладах, то решение конеш можно подобрать, но автору почему то принципиально видимо нужна именно его задача?