1 files changed, 140 insertions, 0 deletions
diff --git a/Base/res/html/misc/nth-child.html b/Base/res/html/misc/nth-child.html
new file mode 100644
index 0000000000..c5e6492dcb
--- /dev/null
+++ b/Base/res/html/misc/nth-child.html
@@ -0,0 +1,140 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>:nth-child test</title>
+    <style>
+        /** We have weird spacing inside parentheses to test parser. */
+        .odd > div:nth-child(odd ),
+        ._2n-plus-1 > div:nth-child(2n+1),
+        .even > div:nth-child( even),
+        ._2n > div:nth-child( 2n ),
+        ._3n > div:nth-child(3n),
+        ._2 > div:nth-child(2 ),
+        ._3n-plus-1 > div:nth-child( 3n + 1 ),
+        ._3n-minus-1 > div:nth-child( 3n -1),
+        ._minus-n-plus-3 > div:nth-child(-n+ 3),
+        .n > div:nth-child(n), /** "n" is special case inside parser. */
+        .plus-n > div:nth-child(+n), /** "+n" is special case inside parser. */
+        .minus-n > div:nth-child(-n), /** "-n" is special case inside parser. */
+        ._0n-plus-1 > div:nth-child(-0n+1),
+        .n-plus-2__minus-n-plus-4 > div:nth-child(+n + 2 ):nth-child( -n+4) {
+            background-color: lightblue;
+        }
+    </style>
+</head>
+<body>
+<h4>:nth-child(odd)</h4>
+<div class="odd">
+    <div>1 +</div>
+    <div>2</div>
+    <div>3 +</div>
+    <div>4</div>
+</div>
+
+<h4>:nth-child(2n+1) - same as odd</h4>
+<div class="_2n-plus-1">
+    <div>1 +</div>
+    <div>2</div>
+    <div>3 +</div>
+    <div>4</div>
+</div>
+
+<h4>:nth-child(even)</h4>
+<div class="even">
+    <div>1</div>
+    <div>2 +</div>
+    <div>3</div>
+    <div>4 +</div>
+</div>
+
+<h4>:nth-child(2n) - same as even</h4>
+<div class="_2n">
+    <div>1</div>
+    <div>2 +</div>
+    <div>3</div>
+    <div>4 +</div>
+</div>
+
+<h4>:nth-child(2)</h4>
+<div class="_2">
+    <div>1</div>
+    <div>2 +</div>
+    <div>3</div>
+</div>
+
+<h4>:nth-child(3n)</h4>
+<div class="_3n">
+    <div>1</div>
+    <div>2</div>
+    <div>3 +</div>
+    <div>4</div>
+    <div>5</div>
+    <div>6 +</div>
+</div>
+
+<h4>:nth-child(3n+1)</h4>
+<div class="_3n-plus-1">
+    <div>1 +</div>
+    <div>2</div>
+    <div>3</div>
+    <div>4 +</div>
+    <div>5</div>
+    <div>6</div>
+</div>
+
+<h4>:nth-child(3n-1)</h4>
+<div class="_3n-minus-1">
+    <div>1</div>
+    <div>2 +</div>
+    <div>3</div>
+    <div>4</div>
+    <div>5 +</div>
+    <div>6</div>
+</div>
+
+<h4>:nth-child(-n+3)</h4>
+<div class="_minus-n-plus-3">
+    <div>1 +</div>
+    <div>2 +</div>
+    <div>3 +</div>
+    <div>4</div>
+</div>
+
+<h4>:nth-child(n)</h4>
+<div class="n">
+    <div>1 +</div>
+    <div>2 +</div>
+    <div>3 +</div>
+</div>
+
+<h4>:nth-child(-n) - same as n</h4>
+<div class="n">
+    <div>1 +</div>
+    <div>2 +</div>
+    <div>3 +</div>
+</div>
+
+<h4>:nth-child(+n) - same as n</h4>
+<div class="n">
+    <div>1 +</div>
+    <div>2 +</div>
+    <div>3 +</div>
+</div>
+
+<h4>:nth-child(0n+1)</h4>
+<div class="_0n-plus-1">
+    <div>1 +</div>
+    <div>2</div>
+    <div>3</div>
+</div>
+
+<h4>:nth-child(n+2):nth-child(-n+4)</h4>
+<div class="n-plus-2__minus-n-plus-4">
+    <div>1</div>
+    <div>2 +</div>
+    <div>3 +</div>
+    <div>4 +</div>
+    <div>5</div>
+</div>
+</body>
+</html>