Уродливые линии на CSS градиентном фоне

Question

Я хотел создать градиент CSS для фона div.

HTML

<section id="library">
    <div id="listHeader"></div>
</section>

CSS

#library {
width: 600px;
margin: 0 auto;
}

#listHeader {
height: 40px;
background: -webkit-gradient(linear, left top, left bottom, from(#1A1B1B), to(#191919));
border-top: 1px solid rgba(51, 51, 51, 0.6);
border-bottom: 1px solid rgba(0, 0, 0, 0.4);
}

Это дает мне фактический градиент, который я хотел достичь, ноу него есть несколько уродливых линий повсюду.

Это результат, который я получаю.(Chrome 11, Mac OSX 10.6.7)

Это также происходит с другими градиентами.например,

background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1D1D1D), to(#181818));

Answer 1

Проблема называется «полосатость» и варьируется от монитора к монитору. Это не так уж плохо для меня, однако я также думаю, что это потому, что ваша цветовая гамма мала для размеров области, которую вы хотите заполнить. Попробуйте увеличить диапазон цветов и поиграйтесь с размерами окна, чтобы увидеть результат.