Использование градиента в качестве фона.

[vedro-compota]

Приветствую верстальщиков))
Возник "вечный" вопрос связанный с использованием неоднородного (но допускающего дублирование) в одном направлении фона.
Есть задача - сделать так , чтобы фоном каждого очередного сообщения( форума ли или просто сообщения комментария) был градиент ( сверху тёмный, а к низу - всё светлее).. И вот два вопроса -
1)если длина сообщения заранее неизвестна - имеются ли средства растягивания этого градиента по вертикальной оси (по горизонтальной можно просто продублировать) .
2) Если таковых средств нет, то можно ли как-нибудь на стороне клиента соответствующим образом растянуть градиент вертикально ( с помощью чего-нибудь типа JAvaScript - опять же, вычислив насколько сильно растягивать) (на стороне сервера, надо понимать такого делать нельзя -сервер не выдержит) .
Заранее благодарю )) Очень интересно - пробовал ли кто-нибудь что-то типа второго пункта и насколько удалось)

[Никки]

.gradient
{
background-image: g.png;
background-repeat: repeat-x;
height: 100%;
}

я бы так попробовал.

[Arigato]

Одни из вариантов решения может быть таким:

.gradient
{
  background-color: #000080;
  background-image: url('bg.png');
  background-repeat: repeat-x;
}

К примеру, градиент переходит из некоторого цвета в темно-синий (#000080), тогда вверху блока будет градиентная заливка, а если блок окажется выше, чем высота картинки, то все, что ниже будет залито одним цветом.

[xDyPx]

Можно воспользоваться css3:

background: -webkit-gradient(linear, 0 0, 0 100%, from(red), to(blue));  
background: -moz-linear-gradient(top, red, blue);

тут неплохо это описывается

[Arigato]

Сообщение от xDyPx

Можно воспользоваться css3:

Лучше их не использовать. Пока что вполне нормально работает способ "по старинке", а css3 еще рано использовать.

[vedro-compota]

Спасибо за советы, друзья)) Как я понял механизма растягивания фона (который background-image) в css2 нет....Arigato предлагает компромисс)))

[Arigato]

Кстати, не стоит забывать, что картинка bg.png должна иметь высоту = высоте градиента, а ширину в 1 пиксель.

[vedro-compota]

а ширину в 1 пиксель.

Агрессивный минимализм) Вообще оптимизация размеров изображения - это ужас.(да-да - это уже другая тема))