Use a CSS Linear Gradient to Create a Striped Element-i didnt understand, plse help mee , how to do

Tell us what’s happening:

Your code so far


    border-radius: 20px;
    width: 70%;
    height: 400px;
    margin:  50 auto;
    background: repeating-linear-gradient(
       0px [yellow]40px [black]80px



Your browser information:

User Agent is: Mozilla/5.0 (Linux; Android 7.1.1; XT1562 Build/NPD26.48-24-1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.111 Mobile Safari/537.36 OPR/46.3.2246.127744.

Link to the challenge:


I think the instructions for this challenge are a little unhelpful and are just confusing to people that are new to it. Hopefully this will help to clarify it:

background: repeating-linear-gradient(
    90deg, // gradient angle
    yellow 0px, // color stop 1
    blue 40px,  // color stop 2
    green 40px, // color stop 3
    red 80px // color stop 4

In order to complete the challenge, you only need to change five things and the syntax stays the same.

The instructions are really getting at how the blending works, which I recommend you experiment with in order to understand it. If you take a look at color stops 2 and 3, you will see that they are both set to 40px- this means that there will be no blending between the blue and green. color stops 3 and 4 are set to different values of px’s and so there is a blending of red and green.

I hope this makes sense and is of some help :slight_smile:

PS: if you are still stuck, see what happens when you change the colors :wink:


thankyoubro,for your concern,my problem solved ,i understand how to do, thanks alott:face_with_raised_eyebrow: