Please explane me how much percents should be total in color gradients? Or how it works? I thought it should be 100% total: (green+yellow+blue): background: -ms-radial-gradient(circle, green 40%, yellow 50%, blue 70%); }

Question

Gradient colors percentage

Answer 1

Gradients are a fade from one color to another. So, if we have a line that's 100 pixels long, that fades from red to green. On every pixel, qe have one less percent of red and one more percent of green. So, at point 1, we have 100% red and 0% green. At pixel 50, it is 50% red and 50% green. At the other end (pixel 100), it is 0% red and 100% green.

Answer 2

Thank you! I got it! This is the position of color relatively to gradient axis. Axis is 100%, so green will start on 40%, yellow on 50% and blue on 70%.

Answer 3

Just remember - you may specify it fixed size, background-width is a base to calculate % from.