Minor text changes

Minor text changes

demos/guide-design/components-eng.html

@@ -872,10 +872,14 @@ <h2 id="toc" class="margin-bottom-none color-dark">Table of contents</h2>
   <h3 class="margin-bottom-none">Correct use</h3>
   <ul>
     <li>Alignment is always on the left of the page. </li>
-    <li>Place at or near the of any page that scrolls when viewed at a 1024x768 screen resolution (unless scrolling is minimal, and adding a Table of contents is no value to the user). </li>
+    <li>Place at or near the of any page that scrolls when viewed at a 1024x768 screen resolution (unless scrolling is minimal, and adding a Table of contents is no value to the user).</li>
     <li>Links are usually to anchors on the same page, although a table of contents can reside on its own page with the links taking the user to anchor on a different page.</li>
-    <li>Links cannot point to both the same page and a new page within the same table of contents.</li>
+    <li>Links targets must either all point to anchors on the same page or to anchors on a new page.  A single table of contents cannot point to both same page anchors as well as new page anchors.</li>
   </ul>
+  <div class="module-note module-simplify">
+  <h3>Note</h3>
+  <p>Although this module is the primary way to display a table of contents, it is not the only option.  For example, an <a href="../grids/grid-button-eng.html#examples">A to Z index </a> at the top of the page can also act as a table of contents on a page that is sorted alphabetically. So the <strong>correct use</strong> list applies to any table of contents, regardless of which design effect or CSS style is used.</p>
+  </div>
 </div>
 <div class="border-left float-right">
   <div class="span-2 margin-bottom-none">