Update reduce-repetition-using-the-repeat-function.english.md (#35787)

This commit is contained in:
Kyle Scheuerlein
2019-04-08 07:39:26 -07:00
committed by The Coding Aviator
parent 42013c9080
commit f590fecb34

View File

@ -8,7 +8,7 @@ videoUrl: 'https://scrimba.com/p/pByETK/cQvqyHR'
## Description
<section id='description'>
When you used <code>grid-template-columns</code> and <code>grid-template-rows</code> to define the structure of a grid, you entered a value for each row or column you created.
Lets say you want a grid with 100 rows of the same height. It isn't very practical to insert 100 values individually. Fortunately, there's a better way - by using the <code>repeat</code> function to specify the number of times you want your column or row to be repeated, followed by a comma and the value you want to repeat.
Let's say you want a grid with 100 rows of the same height. It isn't very practical to insert 100 values individually. Fortunately, there's a better way - by using the <code>repeat</code> function to specify the number of times you want your column or row to be repeated, followed by a comma and the value you want to repeat.
Here's an example that would create the 100 row grid, each row at 50px tall.
<blockquote>grid-template-rows: repeat(100, 50px);</blockquote>
You can also repeat multiple values with the repeat function and insert the function amongst other values when defining a grid structure. Here's what that looks like: