thomaspark/gridgarden

lvl 28

Opened this issue · 8 comments

why not working?
grid-template: repeat(2, 610px)/ 21% 80%

Hi @Illafantoms , let my try help you.

The level 28 have the description:
our garden is looking great. Here you've left a 50 pixel path at the bottom of your garden and filled the rest with carrots.

See my solution: grid-template: 1fr 50px / 1fr 4fr;

The first part (1fr 50px) is reference to your rows, with this u will have 2 rows, one with 1fr and the last with 50px.
The second part is reference to your columns, so u will have 2 columns, one with 1fr and the other with 4fr.

https://uploaddeimagens.com.br/imagens/screen_shot_2019-07-17_at_15-13-50-png

On row side, you need to occupy all of the space before required remaining 50px. The column side is having a little problem percentage.

grid-template: 1fr 50px / 20% 1fr;

1fr 50px / 20% 1fr;

i ended up with this dumb solution which actually worked!
grid-template: repeat(2, calc(100% - 50px)) / 20% 80%;

but your solution seems fine to me.

grid-template: 518px/ 20% 80%

the answer is grid-template:1fr 50px /20% 1fr

the answer is grid-template: 1fr 50px / 20% 80%;

grid-template: 1fr 50px/ 1fr 80%;