W3C home > Mailing lists > Public > www-style@w3.org > August 2014

Re: [css-grid] Confirming some test-case results

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Fri, 1 Aug 2014 08:19:18 -0500
Message-ID: <CAAWBYDBBeHBwt+MR5caBL8KDi0PVJmaXeBndNuenDs_+AGAV1Q@mail.gmail.com>
To: François REMY <francois.remy.dev@outlook.com>
Cc: www-style list <www-style@w3.org>
On Aug 1, 2014 6:12 AM, "François REMY" <francois.remy.dev@outlook.com>
wrote:
>
> Hi,
>
> I would like once again to make sure my current understanding of the CSS
Grid spec is right. Could someone please have a look at the following test
cases (and the result I would expect) to check whether or not it’s
consitent with the spec?
>
> Thanks a lot!
> François
>
> -------------------------------------------------
>
> Test case:
>
>    <ul style="display: grid; grid-template-rows: (start) auto auto (end);
grid-template-columns: (start) auto auto (end)">
>        <li style="grid-row: 1; grid-column: 1 / span 1">1</li>
>        <li>2</li>
>        <li style="grid-row: 2 / span 2; grid-column: auto">3</li>
>        <li style="grid-column: 2 / span 2">4</li>
>        <li>5</li>
>        <li>6</li>
>        <li>7</li>
>    </ul>
>
>
> Expected result:
>
>    Explicit Grid: 2x2
>    Implicit Grid: 3 columns ((2+2)-1)
>
>    1,2,0
>    3,4,4
>    3,5,6
>    7,0,0
>
> -------------------------------------------------
>
> Test case:
>
>    <!-- same as before, but removed <li>2</li> -->
>    <ul style="display: grid; grid-template-rows: (start) auto auto (end);
grid-template-columns: (start) auto auto (end)">
>        <li style="grid-row: 1; grid-column: 1 / span 1">1</li>
>        <li style="grid-row: 2 / span 2; grid-column: auto">3</li>
>        <li style="grid-column: 2 / span 2">4</li>
>        <li>5</li>
>        <li>6</li>
>        <li>7</li>
>    </ul>
>
>
> Expected result:
>
>    Explicit Grid: 2x2
>    Implicit Grid: 3 columns ((2+2)-1)
>
>    1,4,4
>    3,5,6
>    3,7,0
>
> -------------------------------------------------
>
> Test case:
>
>    <!-- same as the first test case, but forced <li>2</li> on first
column -->
>    <ul style="display: grid; grid-template-rows: (start) auto auto (end);
grid-template-columns: (start) auto auto (end)">
>        <li style="grid-row: 1; grid-column: 1 / span 1">1</li>
>        <li style="grid-column: 1">2</li>
>        <li style="grid-row: 2 / span 2; grid-column: auto">3</li>
>        <li style="grid-column: 2 / span 2">4</li>
>        <li>5</li>
>        <li>6</li>
>        <li>7</li>
>    </ul>
>
>
> Expected result:
>
>    Explicit Grid: 2x2
>    Implicit Grid: 3 columns ((2+2)-1)
>
>    1,0,0
>    3,0,0
>    3,0,0
>    2,4,4
>    5,6,7
>
> -------------------------------------------------
>
> Test case:
>
>    <!-- same as before, but forced <li>2</li> on second row, too -->
>    <ul style="display: grid; grid-template-rows: (start) auto auto (end);
grid-template-columns: (start) auto auto (end)">
>        <li style="grid-row: 1; grid-column: 1 / span 1">1</li>
>        <li style="grid-row: 2; grid-column: 1">2</li>
>        <li style="grid-row: 2 / span 2; grid-column: auto">3</li>
>        <li style="grid-column: 2 / span 2">4</li>
>        <li>5</li>
>        <li>6</li>
>        <li>7</li>
>    </ul>
>
>
> Expected result:
>
>    Explicit Grid: 2x2
>    Implicit Grid: 3 columns ((2+2)-1)
>
>    1,4,4
>    2,3,5
>    6,3,7

Yes, these all look correct.

~TJ
Received on Friday, 1 August 2014 13:19:45 UTC

This archive was generated by hypermail 2.3.1 : Friday, 1 August 2014 13:19:45 UTC