Css grid | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 9

Css grid

https://code.sololearn.com/W7oR8NSQZ9gZ/?ref=app How to set auto multiple columns and rows span for specific elements, insted of setting manualy ( for example forst grid-row:2/4; grid-column:5/7; second grid-row:1/3; grid-column:10/12;) and counting the lines. I want to set all elements with class "multy" to span 2 rows and 2 columns.

23rd Apr 2019, 3:38 PM
Sanja Malovic
Sanja Malovic - avatar
7 Answers
+ 2
Try to read up more on Grid: https://css-tricks.com/snippets/css/complete-guide-grid/ Your code looks too convoluted as it stands right now.
23rd Apr 2019, 5:52 PM
Csaba Varga
Csaba Varga - avatar
+ 2
add grid-row: span 2; and grid-colum: span 2; to multi. It won't display correctly on the phone but when you test it in the browser (on sololearn.com) it will do just what you asked for. For some reason the mobile version of the app is putting everything in one column, that's why you cant test the grid capabilities properly.
23rd Apr 2019, 6:58 PM
Csaba Varga
Csaba Varga - avatar
+ 1
Csaba Varga give a link to a great article! I encourage to read it.
24th Apr 2019, 6:16 AM
Jakub Miziński
Jakub Miziński - avatar
+ 1
سدزتيخف. .ء بغ.ؤ. هههههههء نلكصح ةا
24th Apr 2019, 2:51 PM
Ammari Smil
Ammari Smil - avatar
+ 1
Sanja Malovic I tried to look up info on how to do this but havent found any solutions. Keep us posted if you find anything :)
28th Apr 2019, 3:06 PM
Logomonic Learning
Logomonic Learning - avatar
0
زءافشط مةف نزهةال نرق
24th Apr 2019, 2:51 PM
Ammari Smil
Ammari Smil - avatar
0
Add this code: grid-area: span 2 / span 2; to multy class. Order: row/col.
22nd Sep 2020, 2:25 PM
Hassan Aliyu
Hassan Aliyu - avatar