Style updates to DOMMatrix

dirkschulze · svgeesus · commit fe5ec59bfe93 · 2013-09-23T13:50:27.000+02:00
diff --git a/matrix/index.html b/matrix/index.html
@@ -9,10 +9,6 @@
           specStatus:           "ED",
           shortName:            "matrix",
           edDraftURI:           "http://dev.w3.org/fxtf/matrix/",
-          // extraCSS: [
-          //     "http://dev.w3.org/2009/dap/ReSpec.js/css/respec.css",
-          //     "https://dvcs.w3.org/hg/FXTF/raw-file/tip/masking/default.css"
-          // ],
           editors:  [
               { name: "Dirk Schulze", mailto: "dschulze@adobe.com",
                 company: "Adobe Systems Inc.", companyURL: "http://adobe.com/" },
@@ -31,9 +27,16 @@
           // name (without the @w3c.org) of the public mailing to which comments are due
           wgPublicList: "public-fx",
           wgPatentURI:  "",
+          noIDLSorting: true,
           noIDLIn:  true,
       };
     </script>
+    <style type="text/css">
+      body {
+        max-width: 50em;
+        margin: 0 auto !important;
+      }
+    </style>
   </head>
   <body>
     <section id='abstract'>
@@ -207,7 +210,7 @@ <h3>The constructors</h3>
               <dd>A DOMString of transformation functions with the syntax and specifies defined in CSS Transforms [[!CSS3-TRANSFORMS]]. One CSS pixel length maps to one unit less value in the matrix.</dd>
             </dl>
             The DOMString must consist of a transform function list as specified by CSS Transforms.
-            <div class='example'>
+            <pre class='example'>
               <p>In the following example a CSS Transform string is passed to the DOMMatrix constructor.</p>
               <pre><code>var matrix = new DOMMatrix("translate(20px,20px), scale(2,3), rotate(45deg)"</code></pre>
               <p>The resulting matrix is equal to the following sequence of method calls:</p>
@@ -217,7 +220,7 @@ <h3>The constructors</h3>
 matrix.scaleNonUniformBy(2,3);
 matrix.rotateBy(45);
               </code></pre>
-            </div>
+            </pre>
             <p class='issue'>Should unit-less values (like for SVG transform presentation attribute) be allowed too? <code>"translate(20,20)"</code></p>
             <p>Throws a <var>DOMException</var> with name <code>SyntaxError</code> if the <code>DOMString</code> parameter does not validate to a transform list [[!CSS3-TRANSFORMS]].
           </dd>
@@ -762,7 +765,7 @@ <h3>Helper methods</h3>
             <dt>DOMString stringifier ()</dt>
             <dd>
               Returns a string in the form of a CSS Transforms <code>matrix</code> function if the current matrix is a 2D transform or a CSS Transforms <code>matrix3d</code> else. The syntax is as specified in CSS Transforms [[!CSS3-TRANSFORMS]].
-              <div class='example'>
+              <pre class='example'>
                 <p>In this example a matrix is created and several methods with 2D transformations are called.</p>
                 <pre><code>var matrix = new DOMMatrix();
 matrix.scaleBy(2);
@@ -774,7 +777,7 @@ <h3>Helper methods</h3>
 matrix.scale3dBy(2);</code></pre>
                 <p>Calling <code>matrix.toString()</code> after the snippet above returns the DOM string:</p>
                 <pre><code>"matrix3d(2,0,0,0,0,2,0,0,0,0,2,0,0,0,0,1)"</code></pre>
-              </div>
+              </pre>
             </dd>
           </dl>
       </section>
@@ -811,9 +814,9 @@ <h3 id="conventions">
         or are set apart from the normative text with <code>class="example"</code>,
         like this:
 
-        <div class="example">
+        <pre class="example">
           <p>This is an example of an informative example.</p>
-        </div>
+        </pre>
 
         <p>Informative notes begin with the word “Note” and are set apart from the
         normative text with <code>class="note"</code>, like this:
