third_party/WebKit/LayoutTests/css3/selectors3/html/css3-modsel-d1b.html

   1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
   2 <html>
   3  <head>
   4   <title>Dynamic handling of :empty</title>
   5   <style type="text/css">
   6    #test1 { background: red; display: block; padding: 1em; margin: 1em; }
   7    #test1:empty { background: lime; }
   8    #test2 { background: lime; display: block; padding: 1em; margin: 1em; }
   9    #test2:empty { background: red; }
  10 </style>
  11   <link rel="first" href="css3-modsel-1.html" title="Groups of selectors">
  12   <link rel="prev" href="css3-modsel-d1.html" title="NEGATED Dynamic handling of :empty">
  13   <link rel="next" href="css3-modsel-d2.html" title="Dynamic handling of combinators">
  14   <link rel="last" href="css3-modsel-d4.html" title="Dynamic updating of :first-child and :last-child">
  15   <link rel="up" href="./index.html">
  16   <link rel="top" href="../../index.html">
  17  </head>
  18  <body>
  19
  20  <div>
  21
  22   <script type="text/javascript">
  23
  24
  25     function test() {
  26       document.getElementById('test1').appendChild(document.createTextNode(''));
  27       document.getElementById('test2').appendChild(document.createTextNode(' '));
  28     }
  29
  30     window.onload = test;
  31
  32   </script>
  33
  34   <p> The following two bars should be green. </p>
  35
  36   <div id="test1"></div>
  37   <div id="test2"></div>
  38
  39  </div>
  40
  41 </body>
  42 </html>