Add more clarifying language to overview.

fantasai · fantasai · commit 601b547d2948 · 2012-05-16T18:36:51.000-07:00
diff --git a/css3-align/Overview.html b/css3-align/Overview.html
@@ -11,9 +11,11 @@
   type="text/css">
 
   <style type="text/css">
-    body, html { max-width: none; }
+    body, html { max-width: 85em; }
     .issue th:first-child { text-align: left !important; }  
     [rowspan] > img { max-height: 4em; float: right; }  
+    [rowspan] { vertical-align: middle; }
+    small { display: block; }
   </style>
 
  <body>
@@ -23,11 +25,11 @@
 
    <h1>CSS Box Alignment Module Level 3</h1>
 
-   <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 16 May 2012</h2>
+   <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 17 May 2012</h2>
 
    <dl><!--
   <dt>This version:
-    <dd><a href="http://www.w3.org/TR/2012/ED-css3-align-20120516/">http://www.w3.org/TR/2012/ED-css3-align-20120516/</a>
+    <dd><a href="http://www.w3.org/TR/2012/ED-css3-align-20120517/">http://www.w3.org/TR/2012/ED-css3-align-20120517/</a>
   <dt>Latest version:
     <dd><a href="http://www.w3.org/TR/css3-align/">http://www.w3.org/TR/css3-align/</a>
 -->
@@ -342,6 +344,7 @@ <h2 id=overview><span class=secno>2. </span> Overview of Alignment
      <td>inline
 
      <td rowspan=2><img alt="" src=self-target.jpg> element within parent
+      <small>(effectively adjusts margins)</small>
 
      <td>✘
 
@@ -373,6 +376,7 @@ <h2 id=overview><span class=secno>2. </span> Overview of Alignment
      <td>inline
 
      <td rowspan=2><img alt="" src=content-target.jpg>content within element
+      <small>(effectively adjusts padding)</small>
 
      <td>‘<code class=property>flex-pack</code>’
 
@@ -404,8 +408,8 @@ <h2 id=overview><span class=secno>2. </span> Overview of Alignment
      <td>inline
 
      <td rowspan=2><img alt="" src=child-target.jpg> items inside element
-      (controls items with ‘<code class=css>align/justify-outside:
-      auto</code>’)
+      <small>(controls child items’ ‘<code
+      class=css>align/justify-outside: auto</code>’)</small>
 
      <td>✘
 
diff --git a/css3-align/Overview.src.html b/css3-align/Overview.src.html
@@ -9,9 +9,11 @@
   <link rel="stylesheet" type="text/css"
         href="http://www.w3.org/StyleSheets/TR/W3C-[STATUS].css">
   <style type="text/css">
-    body, html { max-width: none; }
+    body, html { max-width: 85em; }
     .issue th:first-child { text-align: left !important; }  
     [rowspan] > img { max-height: 4em; float: right; }  
+    [rowspan] { vertical-align: middle; }
+    small { display: block; }
   </style>
 </head>
 
@@ -165,7 +167,7 @@ <h2 id="overview">
   <tbody>
     <tr><th>'justify-outside'
         <td>inline
-        <td rowspan=2><img src="self-target.jpg" alt=""> element within parent
+        <td rowspan=2><img src="self-target.jpg" alt=""> element within parent <small>(effectively adjusts margins)</small>
         <td>✘
         <td>'grid-row-align'
         <td>✔
@@ -180,7 +182,7 @@ <h2 id="overview">
   <tbody>
     <tr><th>'justify-inside'
         <td>inline
-        <td rowspan=2><img src="content-target.jpg" alt="">content within element
+        <td rowspan=2><img src="content-target.jpg" alt="">content within element <small>(effectively adjusts padding)</small>
         <td>'flex-pack'
         <td>✔
         <td>✔
@@ -195,7 +197,7 @@ <h2 id="overview">
   <tbody>
     <tr><th>'justify-items'
         <td>inline
-        <td rowspan=2><img src="child-target.jpg" alt=""> items inside element (controls items with ''align/justify-outside: auto'') 
+        <td rowspan=2><img src="child-target.jpg" alt=""> items inside element <small>(controls child items&rsquo; ''align/justify-outside: auto'')</small>
         <td>✘
         <td>✔
         <td>✘
