Как сделать, чтобы фон левой или правой колонки заполнял область до футера?
 

Как сделать, чтобы фоновая картинка левой или правой колонки заполняла область до футера? А не ограничивалась той областью, где есть текст?
Кто сталкивался с этой задачей и решил её - подскажите, пожалуйста! :-)

Есть известный пример:

margin-bottom: -32767px;
padding-bottom: 32767px;
у колонки

и overflow: hidden;
у содержащего колонки блока.

Но это не подходит, потому что есть задача отображать тени у колонок, так вот из-за overflow: hidden они не отображаются с внешних краёв :-(

[quote=2225777;35429472]margin-bottom: -32767px; padding-bottom: 32767px;[/quote]

это ппц... ну нету столько пикселей наверное ни у одного монитора в мире, откуда вы берете эти цифры или откуда вы беретесь с такими цифрами?

Кто как заполняет фоном колонки до низа?

Покажи макет для начала...

[url=http://codepen.io/benpearson/pen/fkEGc]позырь[/url]
ваще эта тема обмусолена уже лет 10 как, just google it =)

Вопрос для новичка который ничего не понимает в верстке

Так и есть, я web-программист, а не верстальщик...

Хотя бы словами опишите принцип, как сделать, чтобы фон тянулся до низа, независимо от того, сколько в нём текста...

Вот здесь есть одно решение, но оно с помощью доп. колонки, которая лежит под основной колонкой и держит собой фон для основной колонки.
[url]http://dimox.name/liquid-columns-width-and-height-emulation/[/url]

Так все и делают?

Вот страница, где это надо сделать:
[url]http://www.test.webvertex.ru/[/url]

Сейчас там стоит height: 100% где только можно :-)

свойство height: 100% у нужных колонок - #colmn1, #colmn2, #center1 - (#colmn1_color, #colmn2_color, #center1_color - это их вложенные divs только для цвета фона) - только тогда когда этой свойство height: 100% просталено у всех родителей, вплоть до тега html.

Здесь опытным путём подобрано для #container height: 75%; (зависит от ширины в пикселях шапки и подвала)

html , body, #body, #body_color **
height: 100%;
**

#container **
height: 75%;
**

#columns, #colmn1, #colmn2, #center1, #colmn1_color, #colmn2_color, #center1_color **
height: 100%;
**

Почти подходит, если не делать окно браузера распахнутым на 100% :-(

попробуйте
min-height: 100%;

но, скорее всего нужно всё переверстать по новой, сразу правильно

п.с. в чем именно проблема не знаю, с телефона не вижу

Спасибо за совет!
min-height: 100% пробовали ставить - это действует, как отсутствие вообще свойства height: 100% - то есть все три колонки сразу теряют растягивание фона до низа.

А вот интереснейшая статья по вопросу!
[url]http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks[/url]

Только именно мне она не подходит, потому что мне нужно этим трём колонкам ставить по полной высоте скруглённые углы с помощью box-shadow :-)

А в этом примере отдельных этих колонок с высотой до низа как таковых не существует :-)

Посмотрите статью [url]http://habrahabr.ru/post/148327/[/url] .

2 Искусственный Интеллект1:
Вот спасибо Вам огромное за ссылку!
Перешли с неё на статью-источник - и оттуда взяли решение на jQuery! :-)

Лучший выход - всегда насквозь! :-)

table