<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css" style="display:none;"><!-- P {margin-top:0;margin-bottom:0;} --></style>
</head>
<body dir="ltr">
<div id="divtagdefaultwrapper" style="font-size:12pt;color:#000000;background-color:#FFFFFF;font-family:Calibri,Arial,Helvetica,sans-serif;">
<p>Hello,</p>
<p>for the new members, here are pages explaining the usefulness of column alignment to represent dialogs in SignWriting.</p>
<p><br>
</p>
<p><a id="LPlnk853805" href="http://www.signwriting.org/lessons/grammar/vertical/vert001.html">http://www.signwriting.org/lessons/grammar/vertical/vert001.html</a></p>
<div style="margin-bottom: 20px; overflow: auto; width: 100%; text-indent: 0px;" id="LPBorder_GT_14569704590590.2553999236498965">
<table style="width: 90%; background-color: rgb(255, 255, 255); position: relative; overflow: auto; padding-top: 20px; padding-bottom: 20px; margin-top: 20px; border-top: 1px dotted rgb(200, 200, 200); border-bottom: 1px dotted rgb(200, 200, 200);" id="LPContainer_14569704590470.09928081170144087" cellspacing="0">
<tbody>
<tr style="border-spacing: 0px;" valign="top">
<td colspan="2" style="vertical-align: top; position: relative; padding: 0px; display: table-cell;" id="TextCell_14569704590500.5948883577696148">
<div id="LPRemovePreviewContainer_14569704590500.14965103202566454"></div>
<div style="top: 0px; color: rgb(0, 120, 215); font-weight: 400; font-size: 21px; font-family: "wf_segoe-ui_light","Segoe UI Light","Segoe WP Light","Segoe UI","Segoe WP",Tahoma,Arial,sans-serif; line-height: 21px;" id="LPTitle_14569704590500.2864249395349009">
<a target="_blank" href="http://www.signwriting.org/lessons/grammar/vertical/vert001.html" style="text-decoration: none;" id="LPUrlAnchor_14569704590520.6686303317786684">Writing ASL Grammar In SignWriting</a></div>
<div style="margin: 10px 0px 16px; color: rgb(102, 102, 102); font-weight: 400; font-family: "wf_segoe-ui_normal","Segoe UI","Segoe WP",Tahoma,Arial,sans-serif; font-size: 14px; line-height: 14px;" id="LPMetadata_14569704590520.814690026316032">
www.signwriting.org</div>
<div style="display: block; color: rgb(102, 102, 102); font-weight: 400; font-family: "wf_segoe-ui_normal","Segoe UI","Segoe WP",Tahoma,Arial,sans-serif; font-size: 14px; line-height: 20px; max-height: 100px; overflow: hidden;" id="LPDescription_14569704590570.7955013221968058">
Part One: Why Write Vertically? SignWriting records the way the body looks. If we signed lying down.....then writing horizontally might make sense!</div>
</td>
</tr>
</tbody>
</table>
</div>
<br>
<p></p>
<p><a id="LPlnk905299" href="http://www.signwriting.org/lessons/grammar/vertical/vert002.html">http://www.signwriting.org/lessons/grammar/vertical/vert002.html</a><br>
</p>
<p><a id="LPlnk993501" href="http://www.signwriting.org/lessons/grammar/vertical/vert003.html">http://www.signwriting.org/lessons/grammar/vertical/vert003.html</a></p>
<p><a id="LPlnk14799" href="http://www.signwriting.org/lessons/grammar/vertical/vert004.html">http://www.signwriting.org/lessons/grammar/vertical/vert004.html</a></p>
<p><a id="LPlnk875810" href="http://www.signwriting.org/lessons/grammar/vertical/vert005.html">http://www.signwriting.org/lessons/grammar/vertical/vert005.html</a></p>
<div style="margin-bottom: 20px; overflow: auto; width: 100%; text-indent: 0px;" id="LPBorder_GT_14569705526750.04554580371254913">
<table style="width: 90%; background-color: rgb(255, 255, 255); position: relative; overflow: auto; padding-top: 20px; padding-bottom: 20px; margin-top: 20px; border-top: 1px dotted rgb(200, 200, 200); border-bottom: 1px dotted rgb(200, 200, 200);" id="LPContainer_14569705526580.5624175619843891" cellspacing="0">
<tbody>
<tr style="border-spacing: 0px;" valign="top">
<td colspan="1" style="width: 250px; position: relative; display: table-cell; padding-right: 20px;" id="ImageCell_14569705526620.5272847542759395">
<div style="background-color: rgb(255, 255, 255); height: 250px; position: relative; margin: auto; display: table; width: 130px;" id="LPImageContainer_14569705526620.8788974613990438">
<a target="_blank" href="http://www.signwriting.org/lessons/grammar/vertical/vert005.html" style="display: table-cell; text-align: center;" id="LPImageAnchor_14569705526630.3899367767580514"><img aria-label="Option d’image d’aperçu avec lien sélectionnée. Appuyez deux fois pour ouvrir le lien." style="display: inline-block; margin-left: auto; margin-right: auto; max-width: 250px; max-height: 250px; height: 250px; width: 130px; border-width: 0px; vertical-align: bottom;" height="250" width="130" src="http://www.signwriting.org/lessons/grammar/vertical/vert006.gif"></a></div>
</td>
<td colspan="2" style="vertical-align: top; position: relative; padding: 0px; display: table-cell;" id="TextCell_14569705526650.10636403089287005">
<div id="LPRemovePreviewContainer_14569705526650.20853086745404859"></div>
<div style="top: 0px; color: rgb(0, 120, 215); font-weight: 400; font-size: 21px; font-family: "wf_segoe-ui_light","Segoe UI Light","Segoe WP Light","Segoe UI","Segoe WP",Tahoma,Arial,sans-serif; line-height: 21px;" id="LPTitle_14569705526650.34734055517961715">
<a target="_blank" href="http://www.signwriting.org/lessons/grammar/vertical/vert005.html" style="text-decoration: none;" id="LPUrlAnchor_14569705526690.6435172958010562">Writing ASL Grammar In SignWriting</a></div>
<div style="margin: 10px 0px 16px; color: rgb(102, 102, 102); font-weight: 400; font-family: "wf_segoe-ui_normal","Segoe UI","Segoe WP",Tahoma,Arial,sans-serif; font-size: 14px; line-height: 14px;" id="LPMetadata_14569705526690.06467802234440345">
www.signwriting.org</div>
<div style="display: block; color: rgb(102, 102, 102); font-weight: 400; font-family: "wf_segoe-ui_normal","Segoe UI","Segoe WP",Tahoma,Arial,sans-serif; font-size: 14px; line-height: 20px; max-height: 100px; overflow: hidden;" id="LPDescription_14569705526710.8529320227101801">
English Translation: Grammar Lesson Two Spatial Comparisons It is common in American Sign Language (ASL) to use space to make comparisons. Two things under discussion ...</div>
</td>
</tr>
</tbody>
</table>
</div>
<br>
<p></p>
<p><a id="LPlnk623222" href="http://www.signwriting.org/lessons/grammar/vertical/vert006.html">http://www.signwriting.org/lessons/grammar/vertical/vert006.html</a></p>
<div style="margin-bottom: 20px; overflow: auto; width: 100%; text-indent: 0px;" id="LPBorder_GT_14569705368850.08060942256731307">
<table style="width: 90%; background-color: rgb(255, 255, 255); position: relative; overflow: auto; padding-top: 20px; padding-bottom: 20px; margin-top: 20px; border-top: 1px dotted rgb(200, 200, 200); border-bottom: 1px dotted rgb(200, 200, 200);" id="LPContainer_14569705368730.3964633894244718" cellspacing="0">
<tbody>
<tr style="border-spacing: 0px;" valign="top">
<td colspan="2" style="vertical-align: top; position: relative; padding: 0px; display: table-cell;" id="TextCell_14569705368760.7997358496083417">
<div id="LPRemovePreviewContainer_14569705368760.5967196417672095"></div>
<div style="top: 0px; color: rgb(0, 120, 215); font-weight: 400; font-size: 21px; font-family: "wf_segoe-ui_light","Segoe UI Light","Segoe WP Light","Segoe UI","Segoe WP",Tahoma,Arial,sans-serif; line-height: 21px;" id="LPTitle_14569705368760.8219819964136841">
<a title="Ctrl+Cliquer ou appuyer pour suivre le lien" target="_blank" href="http://www.signwriting.org/lessons/grammar/vertical/vert006.html" style="text-decoration: none;" id="LPUrlAnchor_14569705368790.5450638979071816">Writing ASL Grammar In SignWriting</a></div>
<div style="margin: 10px 0px 16px; color: rgb(102, 102, 102); font-weight: 400; font-family: "wf_segoe-ui_normal","Segoe UI","Segoe WP",Tahoma,Arial,sans-serif; font-size: 14px; line-height: 14px;" id="LPMetadata_14569705368800.10835144856168732">
www.signwriting.org</div>
<div style="display: block; color: rgb(102, 102, 102); font-weight: 400; font-family: "wf_segoe-ui_normal","Segoe UI","Segoe WP",Tahoma,Arial,sans-serif; font-size: 14px; line-height: 20px; max-height: 100px; overflow: hidden;" id="LPDescription_14569705368820.005552325090227739">
English Translation: Let us look at an example to give you an idea: Example: Two different systems, one old and one new. In this example two systems are under ...</div>
</td>
</tr>
</tbody>
</table>
</div>
<br>
<p></p>
<p>André Lemyre<br>
</p>
<br>
<div style="color: rgb(0, 0, 0);">
<hr tabindex="-1" style="display:inline-block; width:98%">
<div id="divRplyFwdMsg" dir="ltr"><font style="font-size:11pt" face="Calibri, sans-serif" color="#000000"><b>De :</b> SignWriting List: Read and Write Sign Languages <SW-L@LISTSERV.VALENCIACOLLEGE.EDU> de la part de Stephen E Slevinski Jr <slevin@SIGNPUDDLE.NET><br>
<b>Envoyé :</b> 2 mars 2016 18:51<br>
<b>À :</b> SW-L@LISTSERV.VALENCIACOLLEGE.EDU<br>
<b>Objet :</b> Re: Vertical SignWriting with borders in the browser</font>
<div> </div>
</div>
<div>
<div class="moz-cite-prefix">On 3/2/16 3:21 PM, Jonathan Duncan wrote:<br>
</div>
<blockquote type="cite">Hi Steve, <br>
I'm really impressed!!!! Thanks for sharing this with everybody. It will be useful for many programmers.<br>
All that reflowing and no Javascript to calculate where each sign goes, just let the browser figure the layout once they are in the web page.
<br>
<br>
Maybe latter you can share the algorithm to calculate margin-right and border-left values for any given sign.<br>
<br>
</blockquote>
Hi Jonathan,<br>
<br>
I put together another codepen that contains the algorithms.<br>
<a id="LPlnk489467" class="moz-txt-link-freetext" href="http://codepen.io/Slevinski/pen/MywOej?editors=0010">http://codepen.io/Slevinski/pen/MywOej?editors=0010</a>
<div style="margin-bottom: 20px; overflow: auto; width: 100%; text-indent: 0px;" id="LPBorder_GT_14569703926650.5165282094506723">
<table style="width: 90%; background-color: rgb(255, 255, 255); position: relative; overflow: auto; padding-top: 20px; padding-bottom: 20px; margin-top: 20px; border-top: 1px dotted rgb(200, 200, 200); border-bottom: 1px dotted rgb(200, 200, 200);" id="LPContainer_14569703926500.9460934741485243" cellspacing="0">
<tbody>
<tr style="border-spacing: 0px;" valign="top">
<td colspan="1" style="width: 250px; position: relative; display: table-cell; padding-right: 20px;" id="ImageCell_14569703926530.1357926773490119">
<div style="background-color: rgb(255, 255, 255); height: 146px; position: relative; margin: auto; display: table; width: 250px;" id="LPImageContainer_14569703926530.0857548072094163">
<a target="_blank" href="http://codepen.io/Slevinski/pen/MywOej?editors=0010" style="display: table-cell; text-align: center;" id="LPImageAnchor_14569703926560.7728873749539761"><img aria-label="Option d’image d’aperçu avec lien sélectionnée. Appuyez deux fois pour ouvrir le lien." style="display: inline-block; margin-left: auto; margin-right: auto; max-width: 250px; max-height: 250px; height: 146px; width: 250px; border-width: 0px; vertical-align: bottom;" height="146" width="250" src="http://codepen.io/Slevinski/pen/MywOej/image/large.png"></a></div>
</td>
<td colspan="2" style="vertical-align: top; position: relative; padding: 0px; display: table-cell;" id="TextCell_14569703926570.4712143833524002">
<div id="LPRemovePreviewContainer_14569703926570.7654701798669195"></div>
<div style="top: 0px; color: rgb(0, 120, 215); font-weight: 400; font-size: 21px; font-family: "wf_segoe-ui_light","Segoe UI Light","Segoe WP Light","Segoe UI","Segoe WP",Tahoma,Arial,sans-serif; line-height: 21px;" id="LPTitle_14569703926570.07567779413713405">
<a target="_blank" href="http://codepen.io/Slevinski/pen/MywOej?editors=0010" style="text-decoration: none;" id="LPUrlAnchor_14569703926610.3183074513137548">Formal SignWriting conversion to Vertical Writing Mode</a></div>
<div style="margin: 10px 0px 16px; color: rgb(102, 102, 102); font-weight: 400; font-family: "wf_segoe-ui_normal","Segoe UI","Segoe WP",Tahoma,Arial,sans-serif; font-size: 14px; line-height: 14px;" id="LPMetadata_14569703926610.39703965338125624">
codepen.io</div>
<div style="display: block; color: rgb(102, 102, 102); font-weight: 400; font-family: "wf_segoe-ui_normal","Segoe UI","Segoe WP",Tahoma,Arial,sans-serif; font-size: 14px; line-height: 20px; max-height: 100px; overflow: hidden;" id="LPDescription_14569703926630.8816591226499125">
...</div>
</td>
</tr>
</tbody>
</table>
</div>
<br>
<br>
It only takes about 20 lines of code because it uses the SignWriting 2010 JavaScript Library.<br>
<a class="moz-txt-link-freetext" href="http://slevinski.github.io/sw10js/">http://slevinski.github.io/sw10js/</a><br>
<br>
Enjoy,<br>
-Steve<br>
________________________________________________
<p></p>
<p>SIGNWRITING LIST INFORMATION </p>
<p>Valerie Sutton SignWriting List moderator sutton@signwriting.org </p>
<p>Post Messages to the SignWriting List: sw-l@listserv.valenciacollege.edu </p>
<p>SignWriting List Archives & Home Page http://www.signwriting.org/forums/swlist
</p>
<p>Join, Leave or Change How You Receive SW List Messages http://listserv.valenciacollege.edu/cgi-bin/wa?SUBED1=SW-L&A=1
</p>
</div>
</div>
</div>
</body>
</html>
________________________________________________
<p>
<p>
SIGNWRITING LIST INFORMATION
<p>
Valerie Sutton
SignWriting List moderator
sutton@signwriting.org
<p>
Post Messages to the SignWriting List:
sw-l@listserv.valenciacollege.edu
<p>
SignWriting List Archives & Home Page
http://www.signwriting.org/forums/swlist
<p>
Join, Leave or Change How You Receive SW List Messages
http://listserv.valenciacollege.edu/cgi-bin/wa?SUBED1=SW-L&A=1