layout/reftests/bugs/323656-2.html

   1 <!DOCTYPE html>
   2 <html>
   3   <head>
   4     <title>Test inheritance through fieldsets and legends</title>
   5     <style>
   6       /**
   7        * The idea is that "color" inherits by default while "border-color" does
   8        * not.  So if the former is red and the latter is green on a parent, and
   9        * the child's border-color is set to "inherit", it'll be green only if
  10        * the child is inheriting from the parent.  If not, it'll either be
  11        * whatever the border-color is on what it's inheriting from, which will
  12        * be red if what it's inheriting from has the default (currentColor)
  13        * border-color).
  14        */
  15
  16       /* 't' for "test" */
  17       * { color: red; border: 0px hidden red; background: transparent }
  18       .t { border-color: green }
  19       .t > :first-child
  20         { border-color: inherit; border-style: solid; border-width: 10px }
  21     </style>
  22     <script>
  23       function make(str) {
  24         return document.createElement(str);
  25       }
  26
  27       window.onload = function() {
  28         document.getElementById("f").appendChild(make("div"));
  29         document.getElementById("l").appendChild(make("span"));
  30       }
  31     </script>
  32   </head>
  33   <body>
  34     <fieldset class="t"><div></div></fieldset>
  35     <fieldset><legend class="t"><span></span></legend></fieldset>
  36     <fieldset class="t" id="f"></fieldset>
  37     <fieldset><legend class="t" id="l"></legend></fieldset>
  38   </body>
  39 </html>