Use a CSS Linear Gradient to Create a Striped Element - not working as expected in chrome

Tell us what’s happening:
I’ve passed this lesson and everything was going great, i tried to test this code in my browser and only got straight up lines with zigzag pattern on the sides of the colors.

could it be for old CSS methods?

Your code so far


<style>

  div{ 
    border-radius: 20px;
    width: 70%;
    height: 400px;
    margin:  50 auto;
    background: repeating-linear-gradient(
      45deg,
      yellow 0px,
      yellow 40px,
      black 40px,
      black 80px
    );
  }

</style>

<div></div>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.87 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/use-a-css-linear-gradient-to-create-a-striped-element

I have Chrome…just tried it and it looks great and passed just fine.