html - CSS Gradient Background Stripes instead of Smooth gradient -
i trying achieve following css background effect in following page.
however, instead of getting smooth gradient, image shown below.
my css:
body{ background:-webkit-radial-gradient(#205983, #0a2742); background:radial-gradient(#205983, #0a2742); overflow:hidden; }
i want achieve same result. have no other css body.
from chrome inspector (for body element)
background: -webkit-radial-gradient(#205983, #0a2742); background: radial-gradient(#205983, #0a2742); overflow: hidden;
i've checked both pages on same browser , don't use css reset code. how can achieve same results. thanks.
the example page provided works fine here in google chrome (v. 28.0.1500.95 m).
i've inspected site's source. css use is:
#wrap { min-width: 600px; height: 100%; position: relative; background: -webkit-radial-gradient(#205983, #0a2742); background: radial-gradient(#205983, #0a2742); overflow: hidden; }
did try using same css rules on site? mainly notice height: 100%;
rule. might good.
furthermore, the gpu , settings on machine might cause problem appear. of time problem originates rendering engine browser uses. sudden color-combinations don't harmonize, causing shown effect.
try different colors. use colorpicker in google chromes inspector (the small rectangle next color value of css rule).
a recommendable online tool generate css gradients is: colorzilla. provides css (or sass css if desired) containing common -vendor- prefixes , adds ie support. have positive experiences it. give try.
good luck!
Comments
Post a Comment