2 files changed, 112 insertions, 84 deletions

diff --git a/htdocs/quickref/index.chtml b/htdocs/quickref/index.chtml
index 20ef217..d139190 100644
--- a/htdocs/quickref/index.chtml
+++ b/htdocs/quickref/index.chtml
@@ -10,7 +10,8 @@
 <%method void content() %>
  <h1>site-C-ing quick reference</h1>
  <p>
   I am hoping to put together some quick reference documentation here. For now,
-  I am adding the component meta-syntax quick reference.
+  I am adding the <a href="/quickref/metasyntax">component meta-syntax quick
+  reference</a>.
  </p>
 </%method>
diff --git a/htdocs/quickref/metasyntax.chtml b/htdocs/quickref/metasyntax.chtml
index a63f596..4efc37c 100644
--- a/htdocs/quickref/metasyntax.chtml
+++ b/htdocs/quickref/metasyntax.chtml
@@ -42,14 +42,16 @@
    <p>
     Break out into the code mode for just one line.
    </p>
    <blockquote class="qr_sample">
-    &nbsp;&lt;body&gt;<br/>
-    <em><a href="#qr__line" title="% description">%</a> for(int t=0;t&lt;10;t++) {<br/></em>
-    &nbsp;&nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
-    &nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/>
-    <em><a href="#qr__line" title="% description">%</a> }<br/></em>
-    &nbsp;&lt;/body&gt;
+    <div>
+     &nbsp;&lt;body&gt;<br/>
+     &nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
+     <em><a href="#qr__line" title="% description">%</a> for(int t=0;t&lt;10;t++) {<br/></em>
+     &nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/>
+     <em><a href="#qr__line" title="% description">%</a> }<br/></em>
+     &nbsp;&lt;/body&gt;
+    </div>
    </blockquote>
   </dd>
 
 % /* <% %> */
@@ -62,12 +64,14 @@
    <p>
     &lt;&lt; <kbd>expression</kbd> into output stream (think c++).
    </p>
    <blockquote class="qr_sample">
-    <a href="#qr__line" title="% description">%</a> for(int t=0;t&lt;10;t++) {<br/>
-    &nbsp;&nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
-    <em>&nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/></em>
-    <a href="#qr__line" title="% description">%</a> }
+    <div>
+     &nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
+     <a href="#qr__line" title="% description">%</a> for(int t=0;t&lt;10;t++) {<br/>
+     <em>&nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/></em>
+     <a href="#qr__line" title="% description">%</a> }
+    </div>
    </blockquote>
   </dd>
 
 % /* %code */
@@ -78,20 +82,23 @@
     </code>
    </a>
   </dt>
   <dd>
-    Escape from the output mode to code mode. Opposite to <code><a href="#qr__output" title="&lt;%output&gt; description">&lt;%output&gt;</a></code>. Roughly the same as <code><a href="#qr__output" title="&lt;%output&gt; description">&lt;/%output&gt;</a> <kbd>...</kbd> <a href="#qr__output" title="&lt;%output&gt; description">&lt;%output&gt;</a></code> (note the reverse order), but more self-explanatory and applies to more cases.
+    <p>
+     Escape from the output mode to code mode. Opposite to <code><a href="#qr__output" title="&lt;%output&gt; description">&lt;%output&gt;</a></code>. Roughly the same as <code><a href="#qr__output" title="&lt;%output&gt; description">&lt;/%output&gt;</a> <kbd>...</kbd> <a href="#qr__output" title="&lt;%output&gt; description">&lt;%output&gt;</a></code> (note the reverse order), but more self-explanatory and applies to more cases.
    </p>
    <blockquote class="qr_sample">
-    &lt;body&gt;<br/>
-    <em>&nbsp;<a href="#qr__code" title="&lt;%code&gt; descrption">&lt;%code&gt;</a><br/></em>
-    &nbsp;&nbsp;for(int t=0;t&lt;10;t++) {<br/>
-    &nbsp;&nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;%output&gt;</a><br/>
-    &nbsp;&nbsp;&nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
-    &nbsp;&nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/>
-    &nbsp;&nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;/%output&gt;</a><br/>
-    <em>&nbsp;<a href="#qr__code" title="&lt;%code&gt; descrption">&lt;/%code&gt;</a><br/></em>
-    &lt;/body&gt;
+    <div>
+     &lt;body&gt;<br/>
+     <em>&nbsp;<a href="#qr__code" title="&lt;%code&gt; descrption">&lt;%code&gt;</a><br/></em>
+     &nbsp;&nbsp;for(int t=0;t&lt;10;t++) {<br/>
+     &nbsp;&nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;%output&gt;</a><br/>
+     &nbsp;&nbsp;&nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
+     &nbsp;&nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/>
+     &nbsp;&nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;/%output&gt;</a><br/>
+     <em>&nbsp;<a href="#qr__code" title="&lt;%code&gt; descrption">&lt;/%code&gt;</a><br/></em>
+     &lt;/body&gt;
+    </div>
    </blockquote>
   </dd>
 
 % /* %codemethod */
@@ -108,12 +115,14 @@
    <p>
     Define the member function. Essentially equivalent to <code><a href="#qr__method" title="&lt;%method ... %&gt; description" class="internal">&lt;%method</a> <kbd>...</kbd> <a href="#qr__method" title="&lt;%method ... %&gt; description" class="internal">%&gt;</a><a href="#qr__code" title="&lt;%code&gt; description" class="internal">&lt;%code&gt;</a> <kbd>...</kbd> <a href="#qr__code" title="&lt;%code&gt; description" class="internal">&lt;/%code&gt;</a><a href="#qr__method" title="&lt;%method ... %&gt; description" class="internal">&lt;/%method&gt;</a></code>.
    </p>
    <blockquote class="qr_sample">
-    <em><a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;%codemethod</a> std::string ua() <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">%&gt;</a><br/>
-    &nbsp;return __CGI-&gt;get_meta("USER_AGENT");<br/>
-    <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;/%codemethod&gt;</a><br/></em>
-    The user agent is: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> ua() <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a><br/>
+    <div>
+     <em><a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;%codemethod</a> std::string ua() <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">%&gt;</a><br/>
+     &nbsp;return __CGI-&gt;get_meta("USER_AGENT");<br/>
+     <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;/%codemethod&gt;</a><br/></em>
+     The user agent is: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> ua() <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a><br/>
+    </div>
    </blockquote>
   </dd>
 
 % /* %constructor */
@@ -130,12 +139,14 @@
    <p>
     Provide the code for constructor.
    </p>
    <blockquote class="qr_sample">
-    <a href="#qr___var" title="%%var description">%%var</a> bool is_msie;<br/>
-    <em><a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;%constructor&gt;</a><br/>
-    &nbsp;is_msie = (__CGI-&gt;get_meta("USER_AGENT").find("MSIE")!=string::npos);<br/>
-    <a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;/%constructor&gt;</a><br/></em>
+    <div>
+     <a href="#qr___var" title="%%var description">%%var</a> bool is_msie;<br/>
+     <em><a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;%constructor&gt;</a><br/>
+     &nbsp;is_msie = (__CGI-&gt;get_meta("USER_AGENT").find("MSIE")!=string::npos);<br/>
+     <a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;/%constructor&gt;</a><br/></em>
+    </div>
    </blockquote>
   </dd>
 
 % /* %decl / %%decl */
@@ -158,16 +169,18 @@
     Put the line(s) of code into the resulting <em>.h</em> file before the
     class declaration.
    </p>
    <blockquote class="qr_sample">
-    <em><a href="#qr___decl" title="%%decl description">%%decl</a> #include &lt;string&gt;<br/></em>
-    <a href="#qr___var" title="%%var description">%%var</a> std::string str = "default"<br/>
-    <em><a href="#qr__decl" title="&lt;%decl&gt; description">&lt;%decl&gt;</a><br/>
-    &nbsp;typedef int integer_t;<br/>
-    <a href="#qr__decl" title="&lt;%decl&gt; description">&lt;/%decl&gt;</a><br/></em>
-    <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;%method</a> void do_nothing(integer_t input) <a href="#qr__method" title="&lt;%method ... %&gt; description">%&gt;</a><br/>
-    &nbsp;nothing is done<br/>
-    <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;/%method&gt;</a>
+    <div>
+     <em><a href="#qr___decl" title="%%decl description">%%decl</a> #include &lt;string&gt;<br/></em>
+     <a href="#qr___var" title="%%var description">%%var</a> std::string str = "default"<br/>
+     <em><a href="#qr__decl" title="&lt;%decl&gt; description">&lt;%decl&gt;</a><br/>
+     &nbsp;typedef int integer_t;<br/>
+     <a href="#qr__decl" title="&lt;%decl&gt; description">&lt;/%decl&gt;</a><br/></em>
+     <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;%method</a> void do_nothing(integer_t input) <a href="#qr__method" title="&lt;%method ... %&gt; description">%&gt;</a><br/>
+     &nbsp;nothing is done<br/>
+     <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;/%method&gt;</a>
+    </div>
    </blockquote>
   </dd>
 
 % /* %%derive */
@@ -180,10 +193,12 @@
    <p>
     Inherit what is there to be inherited from the base component specified.
    </p>
    <blockquote class="qr_sample">
-    <em><a href="#qr___derive" title="%%derive description">%%derive</a> pagelayout = "/ancestry/page_layout.chtml";<br/></em>
-    <a href="#qr__line" title="% description">%</a> pagelayout::member_function();
+    <div>
+     <em><a href="#qr___derive" title="%%derive description">%%derive</a> pagelayout = "/ancestry/page_layout.chtml";<br/></em>
+     <a href="#qr__line" title="% description">%</a> pagelayout::member_function();
+    </div>
    </blockquote>
   </dd>
 
 % /* %destructor */
@@ -200,15 +215,17 @@
    <p>
     Provide the code for destructor.
    </p>
    <blockquote class="qr_sample">
-    <a href="#qr___var" title="%%var description">%%var</a> type_t *tmp = 0;<br/>
-    <a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;%constructor&gt;</a><br/>
-    &nbsp;tmp = new type_t(type_t::option_1);<br/>
-    <a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;/%constructor&gt;</a><br/>
-    <em><a href="#qr__destructor" title="&lt;%destructor&gt; description">&lt;%destructor&gt;</a><br/>
-    &nbsp;delete tmp;<br/>
-    <a href="#qr__destructor" title="&lt;%destructor&gt; description">&lt;/%destructor&gt;</a><br/></em>
+    <div>
+     <a href="#qr___var" title="%%var description">%%var</a> type_t *tmp = 0;<br/>
+     <a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;%constructor&gt;</a><br/>
+     &nbsp;tmp = new type_t(type_t::option_1);<br/>
+     <a href="#qr__constructor" title="&lt;%constructor&gt; description">&lt;/%constructor&gt;</a><br/>
+     <em><a href="#qr__destructor" title="&lt;%destructor&gt; description">&lt;%destructor&gt;</a><br/>
+     &nbsp;delete tmp;<br/>
+     <a href="#qr__destructor" title="&lt;%destructor&gt; description">&lt;/%destructor&gt;</a><br/></em>
+    </div>
    </blockquote>
   </dd>
 
 % /* %impl / %%impl */
@@ -231,27 +248,29 @@
     Put the line(s) of code into the resulting <em>.cc</em> implementation file
     before any members definitions.
    </p>
    <blockquote class="qr_sample">
-    <em><a href"#qr___impl" title="%%impl description">%%impl</a> #include &lt;string.h&gt;<br/></em>
-    <a href="#qr__method" title="&lt;%method ... %gt; description">&lt;%method</a> void output_if_contains(const char *haystack,const char *needle) <a href="#qr__method" title="&lt;%method ... %gt; description">%&gt;</a><br/>
-    <a href="#qr__line" title="% description">%</a> if(strstr(haystack,needle)) {<br/>
-    &nbsp;&nbsp;&nbsp;<a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> haystack <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a><br/>
-    <a href="#qr__line" title="% description">%</a> }<br/>
-    <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;/%method&gt;</a><br/>
-    <em><a href="#qr__impl" title="&lt;%impl&gt; description">&lt;%impl&gt;</a><br/>
-    &nbsp;#include &lt;konforka/exception.h&gt;
-    &nbsp;static const char *tokens[] = {<br/>
-    &nbsp;&nbsp;"token 1", "token 2", "token 3"<br/>
-    &nbsp;};<br/>
-    <a href="#qr__impl" title="&lt;%impl&gt; description">&lt;/%impl&gt;</a><br/></em>
-    <a href="#qr__method" title="&lt;%method ... %gt; description">&lt;%method</a> void output_token(int toknum) <a href="#qr__method" title="&lt;%method ... %gt; description">%&gt;</a><br/>
-    &nbsp;<a href="#qr__code" title="&lt;%code&gt; description">&lt;%code&gt;</a><br/>
-    &nbsp;&nbsp;if(toknum&lt;0 || toknum&gt;=(sizeof(tokens)/sizeof(*tokens)))<br/>
-    &nbsp;&nbsp;&nbsp;throw konforka::exception(CODEPOINT,"out of bounds");<br/>
-    &nbsp;<a href="#qr__code" title="&lt;%code&gt; description">&lt;/%code&gt;</a><br/>
-    &nbsp;<a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> tokens[toknum] <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a><br/>
-    <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;/%method&gt;</a><br/>
+    <div>
+     <em><a href="#qr___impl" title="%%impl description">%%impl</a> #include &lt;string.h&gt;<br/></em>
+     <a href="#qr__method" title="&lt;%method ... %gt; description">&lt;%method</a> void output_if_contains(const char *haystack,const char *needle) <a href="#qr__method" title="&lt;%method ... %gt; description">%&gt;</a><br/>
+     <a href="#qr__line" title="% description">%</a> if(strstr(haystack,needle)) {<br/>
+     &nbsp;&nbsp;&nbsp;<a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> haystack <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a><br/>
+     <a href="#qr__line" title="% description">%</a> }<br/>
+     <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;/%method&gt;</a><br/>
+     <em><a href="#qr__impl" title="&lt;%impl&gt; description">&lt;%impl&gt;</a><br/>
+     &nbsp;#include &lt;konforka/exception.h&gt;
+     &nbsp;static const char *tokens[] = {<br/>
+     &nbsp;&nbsp;"token 1", "token 2", "token 3"<br/>
+     &nbsp;};<br/>
+     <a href="#qr__impl" title="&lt;%impl&gt; description">&lt;/%impl&gt;</a><br/></em>
+     <a href="#qr__method" title="&lt;%method ... %gt; description">&lt;%method</a> void output_token(int toknum) <a href="#qr__method" title="&lt;%method ... %gt; description">%&gt;</a><br/>
+     &nbsp;<a href="#qr__code" title="&lt;%code&gt; description">&lt;%code&gt;</a><br/>
+     &nbsp;&nbsp;if(toknum&lt;0 || toknum&gt;=(sizeof(tokens)/sizeof(*tokens)))<br/>
+     &nbsp;&nbsp;&nbsp;throw konforka::exception(CODEPOINT,"out of bounds");<br/>
+     &nbsp;<a href="#qr__code" title="&lt;%code&gt; description">&lt;/%code&gt;</a><br/>
+     &nbsp;<a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> tokens[toknum] <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a><br/>
+     <a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;/%method&gt;</a><br/>
+    </div>
    </blockquote>
   </dd>
 
 % /* %method */
@@ -268,12 +287,14 @@
    <p>
     Define the member function. Essentially equivalent to <code><a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description" class="internal">&lt;%codemethod</a> <kbd>...</kbd> <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description" class="internal">%&gt;</a><a href="#qr__output" title="&lt;%output&gt; description" class="internal">&lt;%output&gt;</a> <kbd>...</kbd> <a href="#qr__output" title="&lt;%output&gt; description" class="internal">&lt;/%output&gt;</a><a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description" class="internal">&lt;/%codemethod&gt;</a></code>.
    </p>
    <blockquote class="qr_sample">
-    <em><a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;%method</a> void emphasized(const char *t) <a href="#qr__method" title="&lt;%method ... %&gt; description">%&gt;</a><br/>
-    &nbsp;&lt;em&gt;<a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;/em&gt;<br/>
-    <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;/%method&gt;</a><br/></em>
-    <a href="#qr__line" title="% description">%</a> emphasized("emphasized text");
+    <div>
+     <em><a href="#qr__method" title="&lt;%method ... %&gt; description">&lt;%method</a> void emphasized(const char *t) <a href="#qr__method" title="&lt;%method ... %&gt; description">%&gt;</a><br/>
+     &nbsp;&lt;em&gt;<a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;/em&gt;<br/>
+     <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;/%method&gt;</a><br/></em>
+     <a href="#qr__line" title="% description">%</a> emphasized("emphasized text");
+    </div>
    </blockquote>
   </dd>
 
 % /* %output */
@@ -288,16 +309,18 @@
    <p>
     Escape from the code mode to output mode. Opposite to <code><a href="#qr__code" title="&lt;%code&gt; description">&lt;%code&gt;</a></code>. Roughly the same as <code><a href="#qr__code" title="&lt;%code&gt; description">&lt;/%code&gt;</a> <kbd>...</kbd> <a href="#qr__code" title="&lt;%code&gt; description">&lt;%code&gt;</a></code> (note the reverse order), but more self-explanatory and applies to more cases.
    </p>
    <blockquote class="qr_sample">
-    <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;%codemethod</a> void count() <a href="#qr__codemethod" title="&lt;%codemethod ... &gt; description">%&gt;</a><br/>
-    &nbsp;for(int t=0;t&lt;10;t++) {<br/>
-    <em>&nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;%output&gt;</a><br/>
-    &nbsp;&nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
-    &nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/>
-    &nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;/%output&gt;</a><br/></em>
-    <a href="#qr__codemethod" title="&lt;/%codemethod ... %&gt; description">&lt;/%codemethod&gt;</a><br/>
-    <a href="#qr__line" title="% description">%</a> count();
+    <div>
+     <a href="#qr__codemethod" title="&lt;%codemethod ... %&gt; description">&lt;%codemethod</a> void count() <a href="#qr__codemethod" title="&lt;%codemethod ... &gt; description">%&gt;</a><br/>
+     &nbsp;for(int t=0;t&lt;10;t++) {<br/>
+     <em>&nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;%output&gt;</a><br/>
+     &nbsp;&nbsp;&nbsp;Here is the way we count.&lt;br/&gt;<br/>
+     &nbsp;&nbsp;&nbsp;Just saying out loud: <a href="#qr__inline" title="&lt;% ... %&gt; description">&lt;%</a> t <a href="#qr__inline" title="&lt;% ... %&gt; description">%&gt;</a>&lt;br/&gt;<br/>
+     &nbsp;&nbsp;<a href="#qr__output" title="&lt;%output&gt; descrption">&lt;/%output&gt;</a><br/></em>
+     <a href="#qr__codemethod" title="&lt;/%codemethod ... %&gt; description">&lt;/%codemethod&gt;</a><br/>
+     <a href="#qr__line" title="% description">%</a> count();
+    </div>
    </blockquote>
   </dd>
 
 % /* %%pragma */
@@ -314,18 +337,20 @@
    named <code>main</code> is defined, which instructs preprocessor to discard
    the 'main' member that would be generated for the component and call the
    <code>main</code> member of the named base class.</p>
    <blockquote class="qr_sample">
-    <a href="#qr___derive" title="%%derive description">%%derive</a> pagelayout = "/ancestry/page_layout.chtml";<br/>
-    <em><a href="#qr___pragma" title="%%pragma description">%%pragma</a> main=pagelayout</em>
+    <div>
+     <a href="#qr___derive" title="%%derive description">%%derive</a> pagelayout = "/ancestry/page_layout.chtml";<br/>
+     <em><a href="#qr___pragma" title="%%pragma description">%%pragma</a> main=pagelayout</em>
+    </div>
    </blockquote>
   </dd>
 
 % /* %%var */
   <dt>
    <a id="qr___var" name="qr___var" title="member variable declaration">
-    <code>%%var <kbd>type_t</kbd> <kbd>varname</kbd>;<br/>
-    <code>%%var <kbd>type_t</kbd> <kbd>varname</kbd> = <kbd>initalizer</kbd>;<br/>
+    <code>%%var <kbd>type_t</kbd> <kbd>varname</kbd>;</code><br/>
+    <code>%%var <kbd>type_t</kbd> <kbd>varname</kbd> = <kbd>initalizer</kbd>;</code><br/>
    </a>
   </dt>
   <dd>
    <p>
@@ -333,11 +358,13 @@
     putting into the <code>: <kbd>varname</kbd>(<kbd>initializer</kbd>)</code>
     part of the c++ constructor.
    </p>
    <blockquote class="qr_sample">
-    <em><a href="#qr___var" title="%%var description">%%var</a> std::string strval = "default value";<br/>
-    <a href="#qr___var" title="%%var description">%%var</a> int usecount = 0;<br/>
-    <a href="#qr___var" title="%%var description">%%var</a> int whatnot;</em>
+    <div>
+     <em><a href="#qr___var" title="%%var description">%%var</a> std::string strval = "default value";<br/>
+     <a href="#qr___var" title="%%var description">%%var</a> int usecount = 0;<br/>
+     <a href="#qr___var" title="%%var description">%%var</a> int whatnot;</em>
+    </div>
    </blockquote>
   </dd>
 
  </dl>