Need help in , limit items size

HTML-CSS
1

Tell us what’s happening:

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;
   /* Only change code below this line */

   grid-template-columns: repeat(3, minmax(90px 1fr);

   /* Only change 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 6.3; Win64; x64; rv:78.0) Gecko/20100101 Firefox/78.0.

Challenge: Limit Item Size Using the minmax Function

Link to the challenge:

2

Hello there,

Can you see anything missing:

repeat(3, minmax(90px 1fr);

Look closely…there are 2 syntax errors.

Hope this helps

1 Like