Нашёл много примеров. Ни один не работает. И вложенные дивы пробовал, и :before...

Вот, например http://jsfiddle.net/hy7zD/5/ . Пример кода взят отсюда . И немало подобных примеров. У меня лично на Опере 12 и ФФ15 градиента вообще не видно. И в других примерах градиента не видно.

AntonariyПоддержка градиентов еще не до конца кроссбраузерная. В примере со stackoverflow используется -webkit -radial-gradient, аналогичная фигня есть для оперы и FF.

тынц
Я использовал linear-gradient. Это, я так понимаю, для всех одинаковый вариант?

AntonariyПоддержка градиентов еще не до конца кроссбраузерная. В примере со stackoverflow используется -webkit -radial-gradient, аналогичная фигня есть для оперы и FF.

тынц
А в чём прикол делать абсолютно одинаковый синтаксис, добавлять спереди приписку -o, -moz или ещё какую, и потом намекать, что, чтобы нарисовать сраненький градиент, нужно затолкать в код всю эту портянку?

Вроде, вот так работает http://jsfiddle.net/hy7zD/7/ . Так в чём прикол добавлять -о- там или ещё что-то для абсолютно одинакового кода?

Novis DixiRTFM, бэкграунд поддерживает многослойный фон (слои задаются через запятую). http://jsfiddle.net/hy7zD/10/
Не понял, что вы хотели показать своим примером - он вообще ничего не рендерит. У меня рендерит http://jsfiddle.net/hy7zD/9/ , только почему-то градиент уползает, хотя я ему никакого сдвига не придавал.


А вообще, что, линейный градиент - это такая неведомо-крутая хрень, что стандарт ещё не утверждён? Поэтому пока только портянки на полэкрана на каждое такое нестандартизированное свойство?

user7320Novis DixiRTFM, бэкграунд поддерживает многослойный фон (слои задаются через запятую). http://jsfiddle.net/hy7zD/10/
Не понял, что вы хотели показать своим примером - он вообще ничего не рендерит. У меня рендерит http://jsfiddle.net/hy7zD/9/ , только почему-то градиент уползает, хотя я ему никакого сдвига не придавал.
А, ну так у меня та же многослойность, только я её разделил на два элемента - див и его before-составляющую.

Novis DixiВ опере вашей любимой престовой (12.12) всё рендерит. Обновляемся, товарищи.
А. Я пробовал О11.50 и ФФ13. Ну пипец. Я не знал, что линейные градиенты это инновации в вебе, и ещё год-два назад такого не было, и требуются суперпоследние версии браузеров.

Щас переделал сам - работает в ФФ13. А зачем вам бокс-сайзинг? Тем более, что всё равно, что у вас, что у меня избавиться от сдвига градиента не получилось. Надо, чтобы градиент был в границах картинки. Если размеры дива точно указаны по размерам картинки, то почему всё сдвигается?

Novis Dixiuser7320Тем более, что всё равно, что у вас, что у меня избавиться от сдвига градиента не получилось. Надо, чтобы градиент был в границах картинки. Если размеры дива точно указаны по размерам картинки, то почему всё сдвигается?
Потому что картинка 225x150, а не 255x150, @#$@#$!
Да, вы правы. Спасибо.

А теперь главный вопрос - что делать, если надо поддерживать старые браузеры? Вот в последнем примере на jsfiddle всё коротко и лаконично. Но уже видно, что браузеры всего лишь двухгодичной давности не поддерживают это.

1. Т. е. от такого градиента на старых и ещё более старых (например, ИЕ 8, 9) надо отказаться?

2. И даже для новых надо иногда писать портянки с префиксами (например, ФФ13 только с префиксом -moz это понимает)? И это нормально, да?