Added CI attribute selectors and a Firefox Grid bug

meyerweb · meyerweb · commit fe3ae0fa6180 · 2017-05-04T10:43:41.000-04:00
diff --git a/attribute-ci.html b/attribute-ci.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>CSS test</title>
+<meta charset="utf-8" />
+<link rel="stylesheet" type="text/css" href="c/style-insert-tests.css">
+<style type="text/css" media="all" id="tests">
+*[class~="test"] {background: #DDD;}
+*[class~="test" i] {color: green;}
+</style>
+</head>
+<body>
+
+<div class="arena">
+
+<ol>
+<li class="test">List item</li>
+<li class="TEST">List item</li>
+<li class="test element">List item</li>
+<li class="TEST element">List item</li>
+<li class="tested element">List item</li>
+<li class="TESTED element">List item</li>
+</ol>
+
+</div>
+
+</body>
+</html>
diff --git a/firefox/grid-scale.html b/firefox/grid-scale.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8" />
+<title>Firefox grid inspector scaling bug</title>
+<link type="text/css" href="../c/style-insert-tests.css" rel="stylesheet">
+<style type="text/css" id="tests">
+#test {
+	display: grid;
+	grid-template-columns: 10em 10em;
+	grid-template-rows: min-content min-content;
+	grid-gap: 10px;
+	border: 2px solid red; padding: 1em; width: 20em;
+	transform: scale(1.5);
+	transform-origin: top left;
+}
+#test p {border: 1px dotted blue;margin: 0;}
+</style>
+</head>
+<body>
+
+<div id="test">
+<p>One</p>
+<p>Two</p>
+<p>Three</p>
+<p>Four</p>
+</div>
+
+</body>
+</html>
