Градиентный фон и разрешение экранов

[lunaska]

Уважаемые участники.

Я – очень-очень начинающий верстальщик, столкнулась с проблемой, которую никак не могу разрешить. Подскажите, есть ли решение?

Задача.

Фон сайта состоит из горизонтального градиента: по бокам тёмный фон (условно #333), к центру становящийся светлым (#999). Основной цвет сайта - #999. По центру макета стоит картинка фиксированного размера, состоящая (по краям) из светлого фона (#999).

Сначала я решила вставить по бокам макета блоки и залить их градиентной картинкой, но дело в том, что центр сайта – фиксированной ширины, а края – резиновые. И когда размер экрана меняется, то светлые края (#999) уходят под центральный блок с содержимым сайта, а тёмные края (#333) подходят к центру. И стык между основным цветом сайта (#999) и тёмным куском градиента становится очевидным.

Затем я решила сделать большую картинку 1900х1 пикселей с градиентом, к центру уходящим в прозрачность, и поставить её как bg в body. Но на экранах меньшего размера никакого градиента не видно.

Подскажите, пожалуйста, как быть в таком случае.

P.S. Прошу прощения за то, что так коряво объясняю, а также за то, что вопрос почти наверняка очень тупой.

Edited November 17, 2011 by lunaska

[gurylyov]

Вот генератор градиентов. Выбираешь градиент, он выдаёт css-код.