Tell us what’s happening:
I assumed the answer would be 1/5, but its 2/4. I’m not understanding what the task is asking for on this one.
Your code so far
/* Only change code below this line */
grid-column: 1 / 5;
/* Only change code above this line */
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: 1fr 1fr 1fr;
Your browser information:
User Agent is:
Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:76.0) Gecko/20100101 Firefox/76.0.
Challenge: Use grid-column to Control Spacing
Link to the challenge:
Learn to code. Build projects. Earn certifications.Since 2015, 40,000 graduates have gotten jobs at tech companies including Google, Apple, Amazon, and Microsoft.
This is similar to the thread I answered with detail here:
Let’s look back at the image the challenge provided
This shows how the grid columns and row works. So what you are doing is instructing the boxes to start from a certain grid and then end at another grid.
/* Here I asked the element to stop stretching on grid 4 */
/* Here i asked the element to start stretching from grid 2 */
I’m still lost.
The grid stopped stretching at line 4, line 4 is the last line on the grid.
The grid started stretching at line 2, line 2 is NOT the first line on the grid.
Shouldn’t is start stretching from line 1 by default for any grid?
Ok i think I get it now. So on a 3x3 grid if its set to 1/3 for example, the first 2 columns are consumed. If its set to 2/4, the last two columns are consumed.
Alternatively, on a 5x5 grid:
2/5 would consume 3 columns smack dab in the middle.
5/6 would consume the last column, correct?
Yup, you got it. Great Job figuring it out!!!