CSS3 Gradient просто повторяет тонкие линии много раз - PullRequest
0 голосов
/ 27 декабря 2011

Я пытаюсь сделать градиентный фон для моего сайта, http://www.lathamcity.com

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

Чтобы добавить к тайне, при нажатии на две ссылки, чтобы открыть третий div, градиент внезапно меняется. Третий div простирается ниже второго, и расстояние между ними занято первым цветом градиента, а остальные до верхней части страницы - просто нормальный градиент.

Вот код, который я использую для градиентов.

body{
background-color: #1B0D70;
background-image: linear-gradient(bottom, rgb(214,231,232) 49%, rgb(36,155,171) 75%);
background-image: -o-linear-gradient(bottom, rgb(214,231,232) 49%, rgb(36,155,171) 75%);
background-image: -moz-linear-gradient(bottom, rgb(214,231,232) 49%, rgb(36,155,171) 75%);
background-image: -webkit-linear-gradient(bottom, rgb(214,231,232) 49%, rgb(36,155,171) 75%);
background-image: -ms-linear-gradient(bottom, rgb(214,231,232) 49%, rgb(36,155,171) 75%);

background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.49, rgb(214,231,232)),
color-stop(0.75, rgb(36,155,171))
);
}

1 Ответ

2 голосов
/ 27 декабря 2011

В настоящее время ваш body height равен 0px, потому что большинство ваших элементов - absolute position.

Напишите это в своем CSS:

html, body{
 height:100%;
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...