Earlier quoted context omitted.
+1 - I recently went looking for a CSS framework (I was still in the “Bootstrap” mindset), and ultimately decided on vanilla CSS grid + flexbox. If anyone is looking for a resource to learn CSS grid, I highly recommend Grid Garden: http://cssgridgarden.com/
I just started this tutorial. Thats is a "why", not a "how"... So maybe I can ask here. Why grid-column start include the value and grid column end exclude it... In fact where there is a ressource for understanding css logic on the internet?
All CSS grid properties are defined in terms of grid "lines", not cells. If you have a grid of 2x2 cells, there are actually 3 vertical lines and 3 horizontal lines:
1 2 3
1 ┌─┬─┐
2 ├─┼─┤
3 └─┴─┘
"grid-column-start: x" means "this area starts the x vertical line""grid-column-end: y" means "this area ends at the y vertical line"
As you can see, there is no possible ambiguity here on whether you mean "inclusive" or "exclusive" like there would be if you referred to cells (which is why you had this question). That's the reason they chose to go with the "lines" model.
> In fact where there is a ressource for understanding css logic on the internet?
Usually each CSS spec has a rationale and some introduction to the "why" and the "thinking model" of the spec. For CSS grid you may look at [1].