| <!DOCTYPE html> | |
| <html> | |
| <style> | |
| a { | |
| float: left; | |
| background-color: green; | |
| width: 100px; | |
| height: 100px; | |
| margin: 0 13px 13px 0; | |
| } | |
| a:nth-child(3n+3) { | |
| margin-right: 0; | |
| } | |
| a:nth-last-child(-n+3) { | |
| margin-bottom: 30px; | |
| } | |
| div { | |
| width: 370px; | |
| } | |
| </style> | |
| <script> | |
| onload = function () { | |
| test.focus(); | |
| test.blur(); | |
| } | |
| </script> | |
| <body> | |
| <p>This tests that we get nth-child and nth-last-child correct on style recalc. There should be 2 identical rows of green boxes below.</p> | |
| <div> | |
| <a id="test" href=""></a> | |
| <a></a> | |
| <a></a> | |
| <a></a> | |
| <a></a> | |
| <a></a> | |
| </div> |