Вот мой код:
body{
color:#666;
margin:0px;
background: -webkit-gradient( linear, left bottom, left top, color-stop(0.25, #DCDCDC), color-stop(0.75, #FFFFFF));
background: -moz-linear-gradient( center bottom, #DCDCDC 25%,#FFFFFF 75%);
font:13px Arial, Helvetica, sans-serif;
}
Эффект, который я пытаюсь сделать, - это градиент сверху (белый) к низу (серый), но конец нижнего градиента должен останавливаться в конце содержимого. Так, например, если содержимое страницы меньше окна, градиент должен останавливаться в нижней части этого содержимого, а не в нижней части страницы. Этот пример работает в Firefox 3+, но в Google Chrome высота тела автоматически устанавливается на 100% высоты окна.
Есть идеи? Я не хочу менять структуру, потому что я использую элементы HTML5.
Вот пример HTML: (Я удалил содержание из-за ограничений компании)
<html>
<head>
... header here ...
</head>
<body>
<header>
...header content here...
</header>
<article>
...body content here...
</article>
<footer>
...footer content here...
</footer>
</body>
</html>