Градиент на фоне

[npofopr]

Приветствую.

Например есть такая страница

Большая: https://dl.dropboxusercontent.com/u/935663/temp/gradient-block.png

Как видно из картинки, градиент заканчивается на том месте, где заканчивается левое меню, и там тоже есть линия.

В общем то ничего сложного, можно поставить фоновую картинку и нет проблем.

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

В общем то в этом весь вопрос.

Чтобы фон изначально был в 510px например, но если текста будет больше, тоже увеличивался по высоте.

Сейчас примерно вот так: http://jsfiddle.net/npofopr/zDqLW/

[mrnobody]

А если height: 510px; убрать вроде же и получается как задумано.

http://jsfiddle.net/mrnobody/zDqLW/2/

Фуллскрин: http://fiddle.jshell...y/zDqLW/2/show/

Или я чего то не понял?

Edited October 13, 2013 by mrnobody

[npofopr]

Блок с контентом должен прибиваться к тексту сверху, но градиент при этом оставаться в изначальном состоянии, т.е. в 510px.

Но если текста становится больше, как вы добавили текста, то да, градиент должен увеличиться.

Сейчас белый блок контента просто приподнят на 40px, а должен по идее прибиваться к верхнему тексту

[mrnobody]

Посмотрите, сделал вот так, только не знаю как сделать. чтобы он не обрезался или задать блоку .container padding-bototm: 220px; на высоту, большую чем блок .content или же задать margin-bottom: 220px; для .block_purple.

http://jsfiddle.net/mrnobody/zDqLW/6/

На весь экран: http://fiddle.jshell.net/mrnobody/zDqLW/6/show/

[npofopr]

Посмотрите, сделал вот так, только не знаю как сделать. чтобы он не обрезался или задать блоку .container padding-bototm: 220px; на высоту, большую чем блок .content или же задать margin-bottom: 220px; для .block_purple.

http://jsfiddle.net/mrnobody/zDqLW/6/

На весь экран: http://fiddle.jshell...y/zDqLW/6/show/

position: absolute; это не круто)

Тем более 220px это единичный случай. Если добавить много контента http://jsfiddle.net/npofopr/zDqLW/7/ то 220 сменится на 2020px и т.п.

[mrnobody]

Понятно, не знал, думал фиксированная высота будет. А вы уже решили этот вопрос? Интересно очень )

Edited October 14, 2013 by mrnobody

[npofopr]

Понятно, не знал, думал фиксированная высота будет. А вы уже решили этот вопрос? Интересно очень )

Высота не фиксированная + сайт еще адаптивный.

Пока не решил, и видимо не решу... Но если, что придумается, то напишу, если не забуду)

[n0_th1nk]

Честно говоря, не понял ничего с ваше описания проблемы. Но на ум пришло "min-height". Попробуйте

[npofopr]

Честно говоря, не понял ничего с ваше описания проблемы. Но на ум пришло "min-height". Попробуйте

Вы ни только ничего не поняли, но еще и ни одну ссылку не смотрели.