Using the repeat Function Usage

Tell us what’s happening:

container class should have a grid-template-columns property that is set to repeat 3 columns with the width of 1fr.—stuck with repeat

Your code so far


<style>
  .item1{background:LightSkyBlue;}
  .item2{background:LightSalmon;}
  .item3{background:PaleTurquoise;}
  .item4{background:LightPink;}
  .item5{background:PaleGreen;}
  
  .container {
    font-size: 40px;
    min-height: 300px;
    width: 100%;
    background: LightGray;
    display: grid;
    /* change the code below this line */
    
    grid-template-columns: repeat(1fr,1fr);
    
    /* change the code above this line */
    grid-template-rows: 1fr 1fr 1fr;
    grid-gap: 10px;
  }
</style>
  
<div class="container">
  <div class="item1">1</div>
  <div class="item2">2</div>
  <div class="item3">3</div>
  <div class="item4">4</div>
  <div class="item5">5</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/css-grid/reduce-repetition-using-the-repeat-function

That’s not exactly how repeat must be used. In fact, your second parameter is good but not the first one.
You have to precise how many times you want to repeat the value :slightly_smiling_face:

thanks thomolom for your compliment.

but show me how i assign value to my first parameter.

repeat() works like: repeat(no.of times, width/height value).
Hope this is useful :slight_smile: