<story><title>Grid Garden – A game for learning CSS grid</title><url>http://cssgridgarden.com/</url></story><parent_chain><item><author>ajross</author><text>Immediate learnings from the first 3 exercises:&lt;p&gt;1. Grid columns and rows are 1 indexed instead of 0, ensuring a coming decade of mistakes due to the mismatch with Javascript (and, y&amp;#x27;know, everything else) conventions for arrays.&lt;p&gt;2. Grid extents use the &amp;quot;one more than end&amp;quot; convention instead of &amp;quot;length&amp;quot;, which is sorta confusing.  But then they call it &amp;quot;end&amp;quot;, which is even more so.&lt;p&gt;(edit) more:&lt;p&gt;3. grid-area&amp;#x27;s four arguments are, in order (using normal cartesian conventions to show how insane this is): y0 &amp;#x2F; x0 &amp;#x2F; y1 &amp;#x2F; x1.  Has any API anywhere ever tried to specify a rectangle like this?</text></item></parent_chain><comment><author>baby</author><text>Yup, doesn&amp;#x27;t make any sense to me. I think this API would have been better:&lt;p&gt;* grid-column-index-start&lt;p&gt;* grid-column-index-end&lt;p&gt;* grid-column-length&lt;p&gt;PS: I have to say though that this grid thing is fucking awesome, and this game to learn this grid thing is fucking amazing as well.&lt;p&gt;I&amp;#x27;ve being coding HTML since 2001, and have started using CSS in 2005. I can say that I&amp;#x27;ve been dearly missing tables until now.</text></comment>
<story><title>Grid Garden – A game for learning CSS grid</title><url>http://cssgridgarden.com/</url></story><parent_chain><item><author>ajross</author><text>Immediate learnings from the first 3 exercises:&lt;p&gt;1. Grid columns and rows are 1 indexed instead of 0, ensuring a coming decade of mistakes due to the mismatch with Javascript (and, y&amp;#x27;know, everything else) conventions for arrays.&lt;p&gt;2. Grid extents use the &amp;quot;one more than end&amp;quot; convention instead of &amp;quot;length&amp;quot;, which is sorta confusing.  But then they call it &amp;quot;end&amp;quot;, which is even more so.&lt;p&gt;(edit) more:&lt;p&gt;3. grid-area&amp;#x27;s four arguments are, in order (using normal cartesian conventions to show how insane this is): y0 &amp;#x2F; x0 &amp;#x2F; y1 &amp;#x2F; x1.  Has any API anywhere ever tried to specify a rectangle like this?</text></item></parent_chain><comment><author>wnevets</author><text>&amp;gt; Grid columns and rows are 1 indexed instead of 0, ensuring a coming decade of mistakes due to the mismatch with Javascript (and, y&amp;#x27;know, everything else) conventions for arrays&lt;p&gt;but consistent with the rest of CSS IIRC, for example nth-child starts at one</text></comment>