Помогите с background!

[_Magnat_ 0]

Помогите изменить серый фон на сайте http://satsputnik.500mb.net/ на фон с градиентом. Как я только не пробовал изменить его получается одно и тоже (фон получается с градиентом но шапка сайта исчезает за шапку отвечает файл bg_top.jpg саму строку с параметрами для градиента я водил вместо background:#afafaf (отвечает за фон который сейчас на сайте)

вот так получилось

html, body { margin:0; height:100%; font:12px/11px Calibri, Arial, Helvetica, sans-serif; font-style:italic; color:#515151; line-height:14px; background:-webkit-linear-gradient(left, #f9f9f9, #000000); url(../images/style/bg_top.jpg) no-repeat center top; }

также пробовал параметры градиента такие background: url(../images/style/bg_fon.jpg) repeat-y 100% 0; margin: 0; height: 100%;

в заранее сделав изображение с градиентов в фотошопе но и также изменить фон не получилось.

все время шапка исчезает а градиент виден.

Хочу сделать фон градиентом так как у меня шапка сайта в градиенте и что бы фон тоже соответствовал ей

также кто возьмется помочь можете открыть мой сайт через google chrome и с помошью Инструментов разработчика во вкладке Sources выбрать файл templates/black/css/styles.css" и наглядно изменять его что бы увидеть результат. также прошу Вас писать более подробно так как новичок в этом.

Оригинал styles.css

html, body { margin:0; height:100%; font:12px/11px Calibri, Arial, Helvetica, sans-serif; font-style:italic; color:#515151; line-height:14px; background:#afafaf url(../images/style/bg_top.jpg) no-repeat center top; }

#bg_bottom { background:url(../images/style/bg_bottom.jpg) no-repeat center bottom; }

#wrapper { height:auto !important; height:100%; min-height:100%; margin:0 auto; width:1000px; }

#container { background:#FFF url(../images/style/container_bg.gif) repeat-y; }

#header { height:232px; margin-bottom:12px; }

#left { float:left; width:240px; padding:6px 0 0 11px; }

#right { margin-left:262px; padding:6px 0 0 0; }

#footer { height:137px; margin-top:-137px; display:block; overflow:hidden; margin:0 auto; width:1000px; }

.clear { clear:both; }

[prikindel 255]

я не понял , ты собственноручно меняешь фон страницы

satsputnik.500mb.net/templates/black/images/style/bg_top.jpg

на серый градиент и спрашиваешь почему пропадает шапка?

оригинально.

[_Magnat_ 0]

вот сейчас у меня на сайте стоит и шапка и серый фон за серый фон отвечает параметр background:#afafaf вот я этот параметр изменил на параметр

background:-webkit-linear-gradient(left, #f9f9f9, #000000) при этом ни чего не меняется тоесть фон а если в конце этого параметра прописать ; то фон меняется на градиент и шапка исчезаят я пришел к выводу что параметр background:#afafaf работает без точки запятой что хорошо а параметр background:-webkit-linear-gradient(left, #f9f9f9, #000000) не работает без точки запятой

получается что если мне сделать вот так html, body { margin:0; height:100%; font:12px/11px Calibri, Arial, Helvetica, sans-serif; font-style:italic; color:#515151; line-height:14px; background:-webkit-linear-gradient(left, #f9f9f9, #000000) url(../images/style/bg_top.jpg) no-repeat center top; } то отображаться градиент не будет а если поставить точку запятую ту будет отображаться градиент но шапка исчезнет так вот все упирается в точку запятую как мне избавится от этой головоломки

[alex32 942]

потому что какой то суперверстак фон хедера положил в боди. надо переверстывать. bg_top.jpg делать фоном headerа, а потом уже фон тела менять.

Изменено 25 ноября 2012 пользователем alex32

[_Magnat_ 0]

потому что какой то суперверстак фон хедера положил в боди. надо переверстывать. bg_top.jpg делать фоном headerа, а потом уже фон тела менять.

я попробовал перенести строку background:#afafafurl(../images/style/bg_top.jpg) no-repeat center top; } в раздел header и заметил что параметры не работают лишь при добавлении в начале тега body начинает отображаться шапка

[alex32 942]

я еще раз вам повторяю, надо все переделывать. Переносом одной строчки тут ничего не добьешься. Или вы хотите здесь за пять минут пройти курсы верстальщиков?

Изменено 25 ноября 2012 пользователем alex32

[_Magnat_ 0]

А это 100% только 1 путь все переделать может есть иные более легкие пути решения данной проблемы

[alex32 942]

Есть. поглубже изучить html+css

[_Magnat_ 0]

Есть. поглубже изучить html+css

общаясь на другом форуме мне подсказали решение данной проблемы оно выглядит так

html, body { margin:0; height:100%; font:12px/11px Calibri, Arial, Helvetica, sans-serif; font-style:italic; color:#515151; line-height:14px; background: url(../images/style/bg_top.jpg) no-repeat center top ,-webkit-linear-gradient(left, #f9f9f9, #000000);}

.height {height: 500px;}

Изменено 25 ноября 2012 пользователем _Magnat_