Растягинуть див

[magiq]

Есть примерно такая схема сайта

Нужно чтобы sidebar растянулся по высоте content, для того чтобы block3 был на уровне нижней границы content. На практике есть дизайн, автор захотел чтобы в block 3 была некоторая контактная информация + ссылка чтобы подниматься вверх

 
<div id="main">
    	<div class="sidebar">
            	<div class="block1">
           	</div>
            	<div class="block2">
           	</div>
            	<div class="block3">
           	</div>
        </div>

        <div class="content">
        </div>
</div>

Структура вот такая.

Как вариант проскакивала мысль с помощью абсолютного позиционирования, но если sidebar будет больше чем content в таком случае block 3 наложится на него.

Edited March 26, 2011 by magiq

[psywalker]

А таблицы не катят?

[magiq]

Весь макет таблицами - нет. Если какой-то div в таблицу, может есть способ то вполне сгодится.

Edited March 26, 2011 by magiq

[psywalker]

http://chikuyonok.ru/2009/06/float-columns/

[magiq]

Да эту ссылку видел, но способ кажется громоздким. Просто верстка практически готова, только нету block3, по своей оплошности не продумал это сразу, забыл что height: 100% не работает для резиновых родителей.

Edited March 26, 2011 by magiq

[psywalker]

Да эту ссылку видел, но способ кажется громоздким. Просто верстка практически готова, только нету block3, по своей оплошности не продумал это сразу, забыл что height: 100% не работает для резиновых родителей.

Покажи тестовую страницу

[magiq]

http://file.qip.ru/document/l1hNiI-F/Untitled-1.html - страница

http://file.qip.ru/document/G3Kmy53t/style.html - css

[magiq]

Простите, появилась какая-то идея?

[psywalker]

Простите, появилась какая-то идея?

Поймите, у меня ведь тоже могут быть свои дела. Когда освобожусь, посмотрю.

Вот решение:

Помести блоки в один общий контейнер.

<div id="main">
<div id="wrapper" style="position:relative;">
        <div class="sidebar">
                <div class="block1">
                </div>
                <div class="block2">
                </div>

        </div>

        <div class="content">
        </div>                
<div class="block3">
                </div>
</div>
</div>

block3 прижми абсолютом к левому краю вниз, где нужно.

[magiq]

Поймите, у меня ведь тоже могут быть свои дела. Когда освобожусь, посмотрю.

Что вы, это же я у вас помощи просил а не наоборот, я просто думал может кто-то еще может помочь.

[psywalker]

Что вы, это же я у вас помощи просил а не наоборот, я просто думал может кто-то еще может помочь.

Понял. Решение выше написал.

[magiq]

Спасибо! Все работает

[psywalker]

Спасибо! Все работает

А иначе я бы не брался

[magiq]

В IE 6 не отображается левый блок sidebar. Я не уверен нужна ли унылая поддержка IE 6...

Edited March 26, 2011 by magiq

[psywalker]

В IE 6 не отображается левый блок sidebar. Я не уверен нужна ли унылая поддержка IE 6...

Не нужна.