[html5] r5673 - [giow] (0) An example of dir=auto. Since I don't speak Arabic and am relying on [...]
whatwg at whatwg.org
whatwg at whatwg.org
Mon Nov 8 18:14:13 PST 2010
Author: ianh
Date: 2010-11-08 18:14:11 -0800 (Mon, 08 Nov 2010)
New Revision: 5673
Modified:
complete.html
index
source
Log:
[giow] (0) An example of dir=auto. Since I don't speak Arabic and am relying on Wikipedia, a close review by Arabic speakers would be even more welcome than usual.
Fixing http://www.w3.org/Bugs/Public/show_bug.cgi?id=10808
Modified: complete.html
===================================================================
--- complete.html 2010-11-09 00:57:59 UTC (rev 5672)
+++ complete.html 2010-11-09 02:14:11 UTC (rev 5673)
@@ -9726,7 +9726,6 @@
</dd>
-
<dt>If the element is a <a href=#root-element>root element</a> and the <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> attribute is not in a defined state
(i.e. it is not present or has an invalid value)</dt>
@@ -9775,8 +9774,50 @@
to render correctly even in the absence of CSS (e.g. as interpreted
by search engines).</p>
+ <div class=example>
+ <p>This markup fragment is of an IM conversation.</p>
+ <pre><p dir=auto class="u1"><b><bdi>Student</bdi>:</b> How do you write "What's your name?" in Arabic?</p>
+<p dir=auto class="u2"><b><bdi>Teacher</bdi>:</b> ما اسمك؟</p>
+<p dir=auto class="u1"><b><bdi>Student</bdi>:</b> Thanks.</p>
+<p dir=auto class="u2"><b><bdi>Teacher</bdi>:</b> That's written "شكرًا".</p>
+<p dir=auto class="u2"><b><bdi>Teacher</bdi>:</b> Do you know how to write "Please"?</p>
+<p dir=auto class="u1"><b><bdi>Student</bdi>:</b> "من فضلك", right?</p></pre>
+
+<!--
+<!DOCTYPE html>
+<style>
+ div { border: groove #FFFF99; padding: 0.25em; width: 22em; background: #FFFFEE; color: black; }
+ p { margin: 0.25em 0; font: 1em/1 InaiMathi; color: purple; }
+ .u1 { color: teal; }
+</style>
+<div>
+<p dir=ltr class="u1"><b><bdi>Student</bdi>:</b> How do you write "What's your name?" in Arabic?</p>
+<p dir=rtl class="u2"><b><bdi>Teacher</bdi>:</b> ما اسمك؟</p>
+<p dir=ltr class="u1"><b><bdi>Student</bdi>:</b> Thanks.</p>
+<p dir=ltr class="u2"><b><bdi>Teacher</bdi>:</b> That's written "شكرًا".</p>
+<p dir=ltr class="u2"><b><bdi>Teacher</bdi>:</b> Do you know how to write "Please"?</p>
+<p dir=rtl class="u1"><b><bdi>Student</bdi>:</b> "من فضلك", right?</p>
+-->
+
+ <p>Given a suitable style sheet and the default alignment styles
+ for the <code><a href=#the-p-element>p</a></code> element, namely to align the text to the
+ <i>start edge</i> of the paragraph, the resulting rendering could
+ be as follows:</p>
+
+ <p><img alt="Each paragraph rendered as a separate block, with the paragraphs left-aligned except the second paragraph and the last one, which would be right aligned, with the usernames ('Student' and 'Teacher' in this example) flush right, with a colon to their left, and the text first to the left of that." src=http://images.whatwg.org/im.png></p>
+
+ <p>As noted earlier, the <code title=attr-dir-auto><a href=#attr-dir-auto>auto</a></code>
+ value is not a panacea. The final paragraph in this example is
+ misinterpreted as being right-to-left text, since it begins with an
+ Arabic character, which causes the "right?" to be to the left of
+ the Arabic text.</p>
+
+ </div>
+
+
+
<h5 id=classes><span class=secno>3.2.3.6 </span>The <dfn title=attr-class><code>class</code></dfn> attribute</h5>
<p>Every <a href=#html-elements title="HTML elements">HTML element</a> may have a
Modified: index
===================================================================
--- index 2010-11-09 00:57:59 UTC (rev 5672)
+++ index 2010-11-09 02:14:11 UTC (rev 5673)
@@ -9703,7 +9703,6 @@
</dd>
-
<dt>If the element is a <a href=#root-element>root element</a> and the <code title=attr-dir><a href=#the-dir-attribute>dir</a></code> attribute is not in a defined state
(i.e. it is not present or has an invalid value)</dt>
@@ -9752,8 +9751,50 @@
to render correctly even in the absence of CSS (e.g. as interpreted
by search engines).</p>
+ <div class=example>
+ <p>This markup fragment is of an IM conversation.</p>
+ <pre><p dir=auto class="u1"><b><bdi>Student</bdi>:</b> How do you write "What's your name?" in Arabic?</p>
+<p dir=auto class="u2"><b><bdi>Teacher</bdi>:</b> ما اسمك؟</p>
+<p dir=auto class="u1"><b><bdi>Student</bdi>:</b> Thanks.</p>
+<p dir=auto class="u2"><b><bdi>Teacher</bdi>:</b> That's written "شكرًا".</p>
+<p dir=auto class="u2"><b><bdi>Teacher</bdi>:</b> Do you know how to write "Please"?</p>
+<p dir=auto class="u1"><b><bdi>Student</bdi>:</b> "من فضلك", right?</p></pre>
+
+<!--
+<!DOCTYPE html>
+<style>
+ div { border: groove #FFFF99; padding: 0.25em; width: 22em; background: #FFFFEE; color: black; }
+ p { margin: 0.25em 0; font: 1em/1 InaiMathi; color: purple; }
+ .u1 { color: teal; }
+</style>
+<div>
+<p dir=ltr class="u1"><b><bdi>Student</bdi>:</b> How do you write "What's your name?" in Arabic?</p>
+<p dir=rtl class="u2"><b><bdi>Teacher</bdi>:</b> ما اسمك؟</p>
+<p dir=ltr class="u1"><b><bdi>Student</bdi>:</b> Thanks.</p>
+<p dir=ltr class="u2"><b><bdi>Teacher</bdi>:</b> That's written "شكرًا".</p>
+<p dir=ltr class="u2"><b><bdi>Teacher</bdi>:</b> Do you know how to write "Please"?</p>
+<p dir=rtl class="u1"><b><bdi>Student</bdi>:</b> "من فضلك", right?</p>
+-->
+
+ <p>Given a suitable style sheet and the default alignment styles
+ for the <code><a href=#the-p-element>p</a></code> element, namely to align the text to the
+ <i>start edge</i> of the paragraph, the resulting rendering could
+ be as follows:</p>
+
+ <p><img alt="Each paragraph rendered as a separate block, with the paragraphs left-aligned except the second paragraph and the last one, which would be right aligned, with the usernames ('Student' and 'Teacher' in this example) flush right, with a colon to their left, and the text first to the left of that." src=http://images.whatwg.org/im.png></p>
+
+ <p>As noted earlier, the <code title=attr-dir-auto><a href=#attr-dir-auto>auto</a></code>
+ value is not a panacea. The final paragraph in this example is
+ misinterpreted as being right-to-left text, since it begins with an
+ Arabic character, which causes the "right?" to be to the left of
+ the Arabic text.</p>
+
+ </div>
+
+
+
<h5 id=classes><span class=secno>3.2.3.6 </span>The <dfn title=attr-class><code>class</code></dfn> attribute</h5>
<p>Every <a href=#html-elements title="HTML elements">HTML element</a> may have a
Modified: source
===================================================================
--- source 2010-11-09 00:57:59 UTC (rev 5672)
+++ source 2010-11-09 02:14:11 UTC (rev 5673)
@@ -9874,7 +9874,6 @@
</dd>
-
<dt>If the element is a <span>root element</span> and the <code
title="attr-dir">dir</code> attribute is not in a defined state
(i.e. it is not present or has an invalid value)</dt>
@@ -9936,8 +9935,50 @@
to render correctly even in the absence of CSS (e.g. as interpreted
by search engines).</p>
+ <div class="example">
+ <p>This markup fragment is of an IM conversation.</p>
+ <pre><p dir=auto class="u1"><b><bdi>Student</bdi>:</b> How do you write "What's your name?" in Arabic?</p>
+<p dir=auto class="u2"><b><bdi>Teacher</bdi>:</b> ما اسمك؟</p>
+<p dir=auto class="u1"><b><bdi>Student</bdi>:</b> Thanks.</p>
+<p dir=auto class="u2"><b><bdi>Teacher</bdi>:</b> That's written "شكرًا".</p>
+<p dir=auto class="u2"><b><bdi>Teacher</bdi>:</b> Do you know how to write "Please"?</p>
+<p dir=auto class="u1"><b><bdi>Student</bdi>:</b> "من فضلك", right?</p></pre>
+
+<!--
+<!DOCTYPE html>
+<style>
+ div { border: groove #FFFF99; padding: 0.25em; width: 22em; background: #FFFFEE; color: black; }
+ p { margin: 0.25em 0; font: 1em/1 InaiMathi; color: purple; }
+ .u1 { color: teal; }
+</style>
+<div>
+<p dir=ltr class="u1"><b><bdi>Student</bdi>:</b> How do you write "What's your name?" in Arabic?</p>
+<p dir=rtl class="u2"><b><bdi>Teacher</bdi>:</b> ما اسمك؟</p>
+<p dir=ltr class="u1"><b><bdi>Student</bdi>:</b> Thanks.</p>
+<p dir=ltr class="u2"><b><bdi>Teacher</bdi>:</b> That's written "شكرًا".</p>
+<p dir=ltr class="u2"><b><bdi>Teacher</bdi>:</b> Do you know how to write "Please"?</p>
+<p dir=rtl class="u1"><b><bdi>Student</bdi>:</b> "من فضلك", right?</p>
+-->
+
+ <p>Given a suitable style sheet and the default alignment styles
+ for the <code>p</code> element, namely to align the text to the
+ <i>start edge</i> of the paragraph, the resulting rendering could
+ be as follows:</p>
+
+ <p><img src="images/im.png" alt="Each paragraph rendered as a separate block, with the paragraphs left-aligned except the second paragraph and the last one, which would be right aligned, with the usernames ('Student' and 'Teacher' in this example) flush right, with a colon to their left, and the text first to the left of that."></p>
+
+ <p>As noted earlier, the <code title="attr-dir-auto">auto</code>
+ value is not a panacea. The final paragraph in this example is
+ misinterpreted as being right-to-left text, since it begins with an
+ Arabic character, which causes the "right?" to be to the left of
+ the Arabic text.</p>
+
+ </div>
+
+
+
<h5 id="classes">The <dfn title="attr-class"><code>class</code></dfn> attribute</h5>
<p>Every <span title="HTML elements">HTML element</span> may have a
More information about the Commit-Watchers
mailing list