Click here to Skip to main content
15,868,120 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hi I'm just a bit confused about Columns and Rows in CSS Grid.

I've watched a lot of videos and read some articles but some of the definitions that I get don't match up with what I've been learning and what I can see.

I'll explain. So we have this Grid with three columns and two rows.

Here is a visual explanation YouTube video - "CSS Grid Layout Course #09: Set Grid Row and Column"

Just by looking at the Grid one can see that the Codeacademy definition is a little confusing.

The column axis stretches from top to bottom across the web page.

The row axis stretches from left to right across the web page.

What I have tried:

I've tried looking at most of the related YouTube videos. I've read several of articles on the topic and things seem to become more confusing.
Posted
Updated 3-Jan-23 6:47am
Comments
Richard MacCutchan 3-Jan-23 12:21pm    
"The column axis stretches from top to bottom across the web page.
The row axis stretches from left to right across the web page."

So which way did you think these axes should go?
daniel wakeley 3-Jan-23 12:46pm    
Thanks for replying. Well it seems that the columns Stretch from left to right and the Rows make up the cell from top to bottom. Here is an example of a Grid with Three columns and two rows

@@@@@@@@@@@@@@@@@
@ R1 @ R2 @R3@ Column 1
@ @ @ @
@@@@@@@@@@@@@@@@@
@ @ @ @
@ @ @ @ Column 2
@@@@@@@@@@@@@@@@@


So if this is a Grid with two Columns and Three Rows then if would make sense that the column axis runs from left to right and the Row goes from the top down please let me know if I'm missing something!
daniel wakeley 3-Jan-23 12:47pm    
I didn't expect to have the text formatted like that sorry

1 solution

Pretty much all tables work the same way as a calendar: days across, weeks down:
          February
   Sun Mon Tue Wed Thu Fri Sat  
W1  01  02  03  04  05  06  07
W2  08  09  10  11  12  13  14
W3  15  16  17  18  19  20  21
W4  22  23  24  25  26  27  28
W5  29  30  31  01  02  03  04
Each day of the week is a column, each week is a row.
Columns run across from left to right, rows run down from the top.

So 24th February is the 4th row, 3rd column, and 3rd March is 5th row, 6th column.

Make sense?
 
Share this answer
 
Comments
Asadi Purushotham 10-Aug-23 8:14am    
What is the Java
Asadi Purushotham 10-Aug-23 8:14am    
Gh
OriginalGriff 10-Aug-23 8:56am    
What Java?
If you mean my coffee, it's a single estate 100% Arabica Brazilian medium roast called "Tamarin" that I buy in 6Kg boxes twice a year and feed into my bean-to-cup machine along with fresh, pure, Welsh water filtered through granite, and served as black, unsweetened doppio in a glass cup.
If you don't, you will have to be more precise.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900