Авто изменение размера BG и черная нижняя панель

Question

Я пытаюсь придумать какой-то способ получить оба, но я не могу понять, как.

У меня исправлена ​​черная полоса внизу страницы, используя:

body {
    background-image:url(../images/bottom_black.gif);
    background-repeat: repeat-x;
    background-position: 0px 800px;
}

Работает нормально, но я также хочу радиальный градиент bg, поэтому я сделал один и поместил этот код, чтобы он автоматически изменял размеры для разных разрешений:

html {
    background:url(../images/bg.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

Они прекрасно работают каждый, ноне вместе.Я знаю, что они оба являются фоновыми изображениями, и именно поэтому, но должна быть некоторая работа вокруг.Пожалуйста, помогите!

Вот ссылки на тесты:

Изменение размера BG

Черное дно

Answer 1

Вы можете попробовать это

html {
    background:url(../images/bg.jpg) no-repeat center center fixed;
    -webkit-background-size: 100% auto;
    -moz-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
}