Overview.bs

<h1>CSS Text Module Level 4</h1>

<pre class='metadata'>
Shortname: css-text
Level: 4
Status: UD
Group: csswg
ED: http://dev.w3.org/csswg/css-text-4/
Editor: fantasai, Invited Expert, http://fantasai.inkedblade.net/contact
Editor: Koji Ishii, Invited Expert, kojiishi@gluesoft.co.jp
Editor: Alan Stearns, Adobe Systems, stearns@adobe.com
Abstract: This module defines properties for text manipulation and specifies their processing model. It covers line breaking, justification and alignment, white space handling, and text transformation.
</pre>

<h2 id="intro">
Introduction</h2>

	Issue: Add final level 3 content

<h2 id="transforming">
Transforming Text</h2>

	Issue: Add final level 3 content

<h2 id="white-space-processing">
White Space Processing</h2>

	Issue: Add final level 3 tab-size and processing details

<h3 id="white-space-collapsing">
White Space Collapsing: the 'text-space-collapse' property</h3>

	<p class="issue">This section is still under discussion and may change in future drafts.</p>

	<pre class="propdef">
	Name: text-space-collapse
	Value: collapse | discard | preserve | preserve-breaks
	Initial: collapse
	Applies to: all elements
	Inherited: yes
	Percentages: n/a
	Computed value: as specified
	Media: visual
	</pre>

	<p class="issue">Need a property name</p>

	This property declares whether and how
	<a href="#white-space-processing">white space</a> inside the element is
	collapsed. Values have the following meanings, which must be interpreted
	according to the white space processing rules:

	<dl dfn-for=text-space-collapse dfn-type=value>
		<dt><dfn>collapse</dfn>
		<dd>
			This value directs user agents to collapse sequences of white space
			into a single character
			(or <a href="http://www.w3.org/TR/css-text/#line-break-transform">in some cases</a>, no character).

		<dt><dfn>preserve</dfn>
		<dd>
			This value prevents user agents 
			from collapsing sequences of white space. 
			Line feeds are preserved as forced line breaks.

		<dt><dfn>preserve-breaks</dfn>
		<dd>
			This value collapses white space as for ''collapse'', but preserves
			line feeds as forced line breaks.

		<dt><dfn>discard</dfn>
		<dd>
			This value directs user agents to "discard" all white space in the
			element.
			Issue: Does this preserve line break opportunities or no? Do we need a "hide" value?
	</dl>

	<div class="example">
		
		The following style rules implement MathML's white space processing:

		<pre>
			@namespace m "http://www.w3.org/1998/Math/MathML";
			m|* {
				text-space-collapse: discard;
			}
			m|mi, m|mn, m|mo, m|ms, m|mtext {
				text-space-collapse: trim-inner;
			}
		</pre>
	</div>

	<p class="issue">This section is still under discussion and may change in future drafts.</p>

<h3 id="white-space-trim">
White Space Trimming: the 'text-space-trim' property</h3>

	<pre class="propdef">
	Name: text-space-trim
	Value: none | trim-inner || consume-before || consume-after
	Initial: collapse
	Applies to: all elements
	Inherited: no
	Percentages: n/a
	Computed value: as specified
	Media: visual
	</pre>

	This property allows authors to specify trimming behavior
	at the beginning and end of a box.
	Values have the following meanings,
	which must be interpreted according to the white space processing rules:

	<dl dfn-for=text-space-trim dfn-type=value>
		<dt><dfn>trim-inner</dfn>
		<dd>
			For block containers this value directs UAs to discard all whitespace
			at the beginning of the element up to and including the last line feed
			before the first non-white-space character in the element as well as
			to discard all white space at the end of the element starting with the
			first line feed after the last non-white-space character in the element.
			For other elements this value directs UAs to discard all whitespace
			at the beginning and end of the element.

		<dt><dfn>consume-before</dfn>
		<dd>
			This value directs the UA to collapse all collapsible whitespace
			immediately before the start of the element.

		<dt><dfn>consume-after</dfn>
		<dd>
			This value directs the UA to collapse all collapsible whitespace
			immediately after the end of the element.
	</dl>

	<div class="example">
		<p>The following style rules render DT elements as a comma-separated list:
		<pre>
			dt { display: inline; }
			dt + dt:before { content: ", "; text-space-collapse: consume-before; }
		</pre>
	</div>

<h2 id="line-breaking">
Line Breaking and Word Boundaries</h2>

	Issue: Add final level 3 content

<h2 id="wrapping">
Text Wrapping</h2>

	Text wrapping is controlled by the 'text-wrap' and overflow-wrap properties:

	Issue: Add final level 3 overflow-wrap

<h3 id="text-wrap">
Text Wrap Settings: the 'text-wrap' property</h3>

	<pre class="propdef">
	Name: text-wrap
	Value: normal | none | avoid | balance
	Initial: normal
	Applies to: all elements
	Inherited: yes
	Percentages: n/a
	Computed value: as specified
	Media: visual
	</pre>

	This property specifies the mode for text wrapping. Possible values:

	<dl dfn-for=text-wrap dfn-type=value>
		<dt><dfn>normal</dfn>
		<dd>
			Lines may break at allowed break points, as determined by the
			line-breaking rules in effect. Line breaking behavior defined
			for the WJ, ZW, and GL line-breaking classes in
			[[!UAX14]] must be honored.

		<dt><dfn>none</dfn>
		<dd>
			Lines may not break; text that does not fit within the block container
			overflows it.

		<dt><dfn>avoid</dfn>
		<dd>
			Line breaking is suppressed within the element: the UA may only break
			within the element if there are no other valid break points in the
			line. If the text breaks, line-breaking restrictions are honored as for
			''text-wrap/normal''.

		<dt><dfn>balance</dfn>
		<dd>
			Same as ''text-wrap/normal'' for inline-level elements.
			For block-level elements line breaks are chosen to minimize the deviation from the average line length over the entire element
			(including lines that end in a forced break).
			The exact algorithm is UA-defined.

			UAs may treat this value as ''text-wrap/normal'' if there are more than ten lines to balance.

	</dl>

	Regardless of the 'text-wrap' value, lines always break at forced breaks:
	for all values, line-breaking behavior defined for the BK, CR, LF, CM
	NL, and SG line breaking classes in [[!UAX14]] must
	be honored.

	When <span class="property">'text-wrap'</span> is set to ''text-wrap/normal'' or
	''text-wrap/avoid'', UAs that allow breaks at punctuation other than spaces
	should prioritize breakpoints.
	For example, if breaks after slashes have a lower priority than spaces,
	the sequence “check /etc” will never break between the ‘/’ and the ‘e’.
	The UA may use the width of the containing block, the text's language,
	and other factors in assigning priorities.
	As long as care is taken to avoid such awkward breaks, allowing breaks at
	appropriate punctuation other than spaces is recommended, as it results
	in more even-looking margins, particularly in narrow measures.</p>

	<!-- add a sample prioritization algorithm -->

<h4 id="example-avoid">
Example of using 'text-wrap: avoid' in presenting a footer</h4>

	<div class="example">

		The priority of breakpoints can be set to reflect the intended
		grouping of text.

		Given the rules

		<pre>
			footer { text-wrap: avoid; /* inherits to all descendants */ }
		</pre>
		
		and the following markup:

		<pre>
			&lt;footer>
			&lt;venue>27th Internationalization and Unicode Conference&lt;/venue>
			&amp;#8226; &lt;date>April 7, 2005&lt;/date> &amp;#8226;
			&lt;place>Berlin, Germany&lt;/place>
			&lt;/footer>
		</pre>

		In a narrow window the footer could be broken as

		<pre>
			27th Internationalization and Unicode Conference &#8226;
			April 7, 2005 &#8226; Berlin, Germany
		</pre>
		
		or in a narrower window as

		<pre>
			27th Internationalization and Unicode
			Conference &#8226; April 7, 2005 &#8226;
			Berlin, Germany
		</pre>
		
		but not as

		<pre>
			27th Internationalization and Unicode Conference &#8226; April
			7, 2005 &#8226; Berlin, Germany
		</pre>
	</div>

<h2 id="white-space-property">
White Space and Wrapping Shorthand: the 'white-space' property</h2>

	Diff needs to have the shorthand details

<h2 id="hyphenation">
Breaking Within Words</h2>

	Issue: Add final level 3 content

<h3 id="hyphenate-character">
Hyphens: the 'hyphenate-character' property</h3>

	<pre class="propdef">
	Name: hyphenate-character
	Value: auto | &lt;string&gt;
	Initial: auto
	Applies to: all elements
	Inherited: yes
	Percentages: n/a
	Computed value: as specified
	Media: visual
	</pre>

	This property specifies strings that are shown between parts of
	hyphenated words. The <dfn for=hyphenate-character>''auto''</dfn> value means that the user agent should
	find an appropriate value, preferably from the same source as the
	hyphenation dictionary. If a string is specified, it appears at
	the end of the line before a hyphenation break.

	<div class="example">
		In Latin scripts, the hyphen character (U+2010) is often used to
		indicate that a word has been split. Normally, it will not be
		necessary to set it explicitly. However, this can easily be done:
		<pre>
			article { hyphenate-character: "\2010" }
		</pre>
	</div>

	<p class="note">
		Both hyphens triggered by automatic hyphenation and
		hyphens triggered by soft hyphens are rendered according to
		'hyphenate-character'.

<h3 id="hyphenate-size-limits">
Hyphenation Size Limit: the 'hyphenate-limit-zone' property</h3>

	<pre class="propdef">
	Name: hyphenate-limit-zone
	Value: &lt;percentage&gt; | &lt;length&gt;
	Initial: 0
	Applies to: block containers
	Inherited: yes
	Percentages: refers to width of the line box
	Computed value: as specified
	Media: visual
	</pre>

	<p class="issue">Is 'hyphenate-limit-zone' a good name? Comments/suggestions?

	This property specifies the maximum amount of unfilled space (before
	justification) that may be left in the line box before hyphenation is
	triggered to pull part of a word from the next line back up into the
	current line.

<h3 id="hyphenate-char-limits">
Hyphenation Character Limits: the 'hyphenate-limit-chars' property</h3>

	<pre class="propdef">
	Name: hyphenate-limit-chars
	Value: [auto | &lt;integer&gt;]{1,3}
	Initial: auto
	Applies to: all elements
	Inherited: yes
	Percentages: n/a
	Computed value: as specified
	Media: visual
	</pre>

	This property specifies the minimum number of characters in a
	hyphenated word. If the word does not meet the required minimum
	number of characters in the word / before the hyphen / after the
	hyphen, then the word must not be hyphenated. Nonspacing combining
	marks (<span class="issue">Unicode class</span>) and intra-word
	punctuation (Unicode classes P*) do not count towards the minimum.

	If three values are specified, the first value is the required
	minimum for the total characters in a word, the second value is
	the minimum for characters before the hyphenation point, and
	the third value is the minimum for characters after the hyphenation
	point. If the third value is missing, it is the same as the second.
	If the second value is missing, then it is ''auto''. The ''auto''
	value means that the UA chooses a value that adapts to the current
	layout.

	<p class="note">Unless the UA is able to calculate a better value, it
		is suggested that ''auto'' means 2 for before and after, and 5 for
		the word total.

	<div class="example">
		In the example below, the minimum size of a hyphenated word is
		left to the UA (which means it may vary depending on the language,
		the length of the line, or other factors), but the minimum number
		of characters before and after the hyphenation point is set to 3.
		<pre>
			p { hyphenate-limit-chars: auto 3; }
		</pre>
	</div>

<h3 id="hyphenate-line-limits">
Hyphenation Line Limits: the 'hyphenate-limit-lines' and 'hyphenate-limit-last' properties</h3>

	<pre class="propdef">
	Name: hyphenate-limit-lines
	Value: no-limit | &lt;integer&gt;
	Initial: no-limit
	Applies to: block containers
	Inherited: yes
	Percentages: n/a
	Computed value: as specified
	Media: visual
	</pre>

	This property indicates the maximum number of successive hyphenated
	lines in an element. The ''no-limit'' value means that there is no limit.

	In some cases, user agents may not be able to	honor the specified value.
	(See overflow-wrap.) It is not defined whether hyphenation introduced by
	such emergency breaking influences nearby hyphenation points.

	<pre class="propdef">
	Name: hyphenate-limit-last
	Value: none | always | column | page | spread
	Initial: none
	Applies to: block containers
	Inherited: yes
	Percentages: n/a
	Computed value: as specified
	Media: visual
	</pre>


	This property indicates hyphenation behavior at the end of elements,
	column, pages and spreads. A spread is a set of two pages that are
	visible to the reader at the same time. Values are:

	<dl dfn-for=hyphenate-limit-lines dfn-type=value>
		<dt><dfn>none</dfn>
		<dd>
			No restrictions imposed.

		<dt><dfn>always</dfn>
		<dd>
			The last full line of the element, or the last line before any
			column, page, or spread break inside the element should not be
			hyphenated.

		<dt><dfn>column</dfn>
		<dd>
			The last line before any column, page, or spread break inside
			the element should not be hyphenated.

		<dt><dfn>page</dfn>
		<dd>
			The last line before page or spread break inside the element
			should not be hyphenated.

		<dt><dfn>spread</dfn>
		<dd>
			The last line before any spread break inside the element should
			not be hyphenated.
	</dl>

	<div class=example>
		<pre>
			p { hyphenate-limit-last: always }
			div.chapter {	hyphenate-limit-last: spread }
		</pre>
	</div>

	<div class=example>
		
		A paragraph may be formatted like this when 'hyphenate-limit-last: none' is set:
		<pre>
			This is just a
			simple example
			to show Antarc-
			tica.
		</pre>

		With 'hyphenate-limit-last: always' one would get:

		<pre>
			This is just a
			simple example
			to        show
			Antarctica.
		</pre>
	</div>

<h2 id="alignment">
Alignment and Justification</h2>

	Issue: Add final level 3 content

	Add this value to text-align

	<dl dfn-for=text-align dfn-type=value>
		<dt><dfn>&lt;string&gt;</dfn></dt>
		<dd>
			The string must be a single character; otherwise the declaration must
			be <a href="http://www.w3.org/TR/CSS21/conform.html#ignore">ignored</a>.
			When applied to a table cell, specifies the <dfn>alignment character</dfn>
			around which the cell's contents will align. See
			<a href="#character-alignment">below</a> for further details and
			how this value combines with keywords.
	</dl>

<h3 id="character-alignment">
Character-based Alignment in a Table Column</h3>

	When multiple cells in a column have an <i>alignment character</i> specified,
	the alignment character of each such cell in the column is centered along
	a single column-parallel axis and the rest of the text in the column
	shifted accordingly. (Note that the strings do not have to be the same
	for each cell, although they usually are.)

	<div class="example">

		The following style sheet:

		<pre>
			TD { text-align: "." center }
		</pre>
	
		will cause the column of dollar figures in the following HTML table:

		<pre class="html-example">
			&lt;TABLE&gt;
			&lt;COL width="40"&gt;
			&lt;TR&gt; &lt;TH&gt;Long distance calls
			&lt;TR&gt; &lt;TD&gt; $1.30
			&lt;TR&gt; &lt;TD&gt; $2.50
			&lt;TR&gt; &lt;TD&gt; $10.80
			&lt;TR&gt; &lt;TD&gt; $111.01
			&lt;TR&gt; &lt;TD&gt; $85.
			&lt;TR&gt; &lt;TD&gt; N/A
			&lt;TR&gt; &lt;TD&gt; $.05
			&lt;TR&gt; &lt;TD&gt; $.06
			&lt;/TABLE&gt;
		</pre>

		to align along the decimal point. The table might be rendered as
		follows:

		<pre>
			+---------------------+
			| Long distance calls |
			+---------------------+
			|        $11.30       |
			|        $22.50       |
			|         $0.80       |
			|    $200567.01       |
			|        $85.         |
			|        N/A          |
			|          $.05       |
			|          $.06       |
			+---------------------+
		</pre>
	</div>

	A keyword value may be specified in conjunction with the &lt;string&gt;
	value; if it is not given, it defaults to ''text-align/right''. This value is used:

	<ul>
		<li>
			when character-based alignment is applied to boxes that are not table
			cells.
		<li>
			when the text wraps to multiple lines (at unforced break points).
		<li>
			when a character-aligned cell spans more than one column. In this
			case the keyword alignment value is used to determine which column's
			axis to align with: the leftmost column for ''text-align/left'', the rightmost
			column for ''text-align/right'' and ''text-align/center'', the startmost column for ''text-align/start'',
			the endmost column for ''text-align/end''.
		<li>
			when the column is wide enough that the character alignment alone does
			not determine the positions of its character-aligned contents. In this
			case the keyword alignment of the first cell in the column with a
			specified alignment character is used to slide the position of the
			character-aligned contents to match the keyword alignment insofar as
			possible without changing the width of the column.
			For ''text-align/center'', the UA may center
			the aligned contents using its extremes, center the alignment axis
			itself (insofar as possible), or optically center the aligned contents
			some other way (such as by taking a weighted average of the extent of
			the cells' contents to either side of the axis).
	</ul>

	<p class="note">
		Right alignment is used by default for character-based
		alignment because numbering systems are almost all left-to-right even
		in right-to-left writing systems, and the primary use case of
		character-based alignment is for numerical alignment.
	</p>

	If the alignment character appears more than once in the text, the first
	instance is used for alignment. If the alignment character does not appear
	in a cell at all, the string is aligned as if the alignment character had
	been inserted at the end of its contents.

	Character-based alignment occurs before table cell width computation so
	that auto width computations can leave enough space for alignment.
	Whether column-spanning cells participate in the alignment prior to
	or after width computation is undefined.
	If width constraints on the cell contents prevent full alignment
	throughout the column, the resulting alignment is undefined.


<h2 id="spacing">
Spacing</h2>

	Issue: Add final level 3 word-spacing, letter-spacing

<h3 id="text-spacing-property">
Character Class Spacing: the 'text-spacing' property</h3>

	<table class="propdef">
		<tr>
			<th>Name:
			<td><dfn>text-spacing</dfn>
		<tr>
			<th>Value:
			<td>normal | none |
					[ trim-start | space-start ] ||
					[ trim-end | space-end | allow-end ] ||
					[ trim-adjacent | space-adjacent ] ||
					no-compress ||
					ideograph-alpha ||
					ideograph-numeric ||
					punctuation
		<tr>
			<th>Initial:
			<td>normal
		<tr>
			<th>Applies to:
			<td>block containers
		<tr>
			<th>Inherited:
			<td>yes
		<tr>
			<th>Percentages:
			<td>N/A
		<tr>
			<th>Media:
			<td>visual
		<tr>
			<th>Computed&#160;value:
			<td>specified value
	</table>

	This property controls spacing between adjacent characters
	on the same line within the same inline formatting context
	using a set of character-class-based rules.
	Such spacing can either be created between or trimmed from the affected glyphs.
	Values are defined as follows:

	<dl dfn-for=text-spacing dfn-type=value>
		<dt><dfn>normal</dfn>
		<dd>
			Specifies the baseline behavior,
			equivalent to ''space-start allow-end trim-adjacent''.

		<dt><dfn>none</dfn>
		<dd>
			Turns off all text-spacing features.
			All fullwidth characters are set with full-width glyphs.

		<dt><dfn>ideograph-alpha</dfn>
		<dd>
			Creates 1/4em extra spacing between runs of
			<i>ideographs</i> and <i>non-ideographic letters</i>.

			Note: A commonly used algorithm for determining this behavior is specified in [[JLREQ]].

		<dt><dfn>ideograph-numeric</dfn>
		<dd>
			Creates 1/4em extra spacing between runs of
			<i>ideographs</i> and <i>non-ideographic numerals</i> glyphs.

			Note: A commonly used algorithm for determining this behavior is specified in [[JLREQ]].

		<dt><dfn>punctuation</dfn>
		<dd>
			Creates extra non-breaking spacing around punctuation as required by language-specific typographic conventions.

			In this level, if the element's content language is French,
			narrow no-break space (U+202F) and no-break space (U+00A0) is inserted
			where required by <a href="http://unicode.org/udhr/n/notes_fra.html">French typographic guidelines</a>.
			Otherwise this value has no effect.
			However future specifications may add automatic spacing behavior for other languages.

		<dt><dfn>space-start</dfn>
		<dd>
			Set <i>fullwidth opening punctuation</i> with full-width glyphs (spaced)
			at the start of each line.

		<dt><dfn>trim-start</dfn>
		<dd>
			Set <i>fullwidth opening punctuation</i> with half-width glyphs (flush)
			at the start of each line.

		<dt><dfn>allow-end</dfn>
		<dd>
			Set <i>fullwidth closing punctuation</i> with half-width glyphs (flush)
			at the end of each line
			if it does not otherwise fit prior to justification;
			otherwise set the punctuation with full-width glyphs.

		<dt><dfn>space-end</dfn>
		<dd>
			Set <i>fullwidth opening punctuation</i> with full-width glyphs (spaced)
			at the start of each line.

		<dt><dfn>trim-end</dfn>
		<dd>
			Set <i>fullwidth closing punctuation</i> with half-width glyphs (flush)
			at the end of each line.

		<dt><dfn>space-adjacent</dfn>
		<dd>
			Set <i>fullwidth opening punctuation</i> with full-width glyphs (spaced)
			when not at the start of the line.
			Set <i>fullwidth closing punctuation</i> with full-width glyphs (spaced)
			when not at the end of the line.

		<dt><dfn>trim-adjacent</dfn>
		<dd>
			Collapse spacing between punctuation glyphs
			<a href="#fullwidth-collapsing">as described below</a>.

		<dt><dfn>no-compress</dfn>
		<dd>
			Justification may not compress text-spacing.
			(If this value is not specified, the justification process may reduce autospacing
			except when the spacing is at the start or end of the line.)

			Note: An example of compression rules is given for Japanese
			in 3.8 Line Adjustment in [[JLREQ]].
	</dl>

	This property is additive with the 'word-spacing' and 'letter-spacing' properties.
	That is, the amount of spacing contributed by the 'letter-spacing' setting (if any)
	is added to the spacing created by 'text-spacing'.
	The same applies to 'word-spacing'.

	At element boundaries, the amount of extra spacing introduced between characters
	is determined by and rendered within the innermost element that contains the boundary.
	If the extra spacing is applied to a particular glyph,
	then the spacing is determined by the innermost element containing that glyph.

	Note: Values other than ''text-spacing/normal'', ''text-spacing/none'', ''trim-start'', ''trim-end'', and ''space-end''
	are at-risk and may be dropped from this level of CSS.
	They are defined here currently to help work out a complete design of this feature.

	Support for this property is <em>optional</em>.
	It is strongly recommended for UAs that wish to support CJK typography.

	Issue: It was requested to add a value for doubling the space after periods.

<h4 id="fullwidth-collapsing">
Fullwidth Punctuation Collapsing</h4>

	Typically, fullwidth characters have glyphs with the same advance width
	as a standard Han character (e.g. 水 U+6C34).
	However, many fullwidth punctuation glyphs only take up part of the fullwidth design space.
	Thus such punctuation are not always set fullwidth.
	Several values of 'text-spacing' allow the author to control
	when such characters are set half-width (typically half the width of an ideograph)
	and when they are set full-width.

	In order to set the text as specified, the UA will need to either
	<ul>
		<li>
			trim (kern) the blank half of the glyphs,
			if they are given full-width and must be set half-width, or
		<li>
			add space to the glyphs,
			if they are given half-width must be set full-width.
	</ul>

	Some fonts use proportional glyphs for fullwidth punctuation characters.
	For such proportional glyphs, the given advance width is considered
	simultaneously full-width and half-width: no space is added or removed.

	<p class="note">
		The advance width of a standard Han character
		can be determined either from font metrics
		such as the OpenType <code>ideo</code> and <code>idtp</code> baselines for the opposite writing mode,
		or by taking the advance width of a Han character such as 水 U+6C34.
		(The opposite writing mode must be used because some fonts are compressed
		so that the characters are not square.)
		More information on OpenType metrics can be found
		<a href="http://www.microsoft.com/typography/otspec/baselinetags.htm#ideoembox">in the OpenType spec</a>.
		Note that if 水 U+6C34, 卜 U+535C, and 一 U+4E00 do not all have the same advance width,
		the font has proportional ideographs
		and the fullwidth advance width cannot be reliably determined by measuring glyphs.

	Unless 'text-spacing' is set to ''space-adjacent'' or ''text-spacing/none''
	(or the font has proportional fullwidth punctuation glyphs),
	the UA must collapse the space typically associated with such full width glyphs
	as follows:

	<ul>
		<li>
			Set <i>fullwidth opening punctuation</i> half-width if the previous character is
			a <i>fullwidth opening punctuation</i>,
			<i>fullwidth middle dot punctuation</i>,
			or ideographic space (U+3000).
			Else set it full-width.
		<li>
			Set <i>fullwidth closing punctuation</i> half-width if the next character is
			a <i>fullwidth closing punctuation</i>,
			<i>fullwidth middle dot punctuation</i>,
			or ideographic space (U+3000).
			Else set it full-width.
		<li>
			Set <i>fullwidth closing punctuation</i> followed by <i>fullwidth opening punctuation</i>
			each at "3/4-width", i.e. halfway between full-width and half-width.
	</ul>

	<div class="example">
		The following example table lists the punctuation pairs
		affected by adjancent-pairs trimming.
		It uses halfwidth equivalents to approximate the trimming effect.

		<table class="data">
			<caption>Demonstration of adjacent-pairs punctuation trimming</caption>
			<thead>
				<tr><th>Combination
						<th>Sample Pair
						<th>Looks Like
			<tbody>
				<tr><td scope=row>Opening&#8212;Opening
						<td><tt lang="ja" class="char">〔</tt>+<tt lang="ja" class="char">（</tt>
						<td><tt lang="ja" class="char">〔</tt><tt lang="ja" class="char half-r">(</tt>
				<tr><td scope=row>Middle Dot&#8212;Opening
						<td><tt lang="ja" class="char">・</tt>+<tt lang="ja" class="char">（</tt>
						<td><tt lang="ja" class="char">・</tt><tt lang="ja" class="char">(</tt>
				<tr><td scope=row>Closing&#8212;Opening
						<td><tt lang="ja" class="char">〕</tt>+<tt lang="ja" class="char">（</tt>
						<td><tt lang="ja" class="char">)<span class="quarter">&#x3000;</span></tt><tt lang="ja" class="char"><span class="quarter">&#x3000;</span>(</tt>
				<tr><td scope=row>Ideographic Space&#8212;Opening
						<td><tt lang="ja" class="char">　</tt>+<tt lang="ja" class="char">（</tt>
						<td><tt lang="ja" class="char">　</tt><tt lang="ja" class="char">(</tt>
				<tr><td scope=row>Closing&#8212;Closing
						<td><tt lang="ja" class="char">）</tt>+<tt lang="ja" class="char">〕</tt>
						<td><tt lang="ja" class="char">)</tt><tt lang="ja" class="char">〕</tt>
				<tr><td scope=row>Closing&#8212;Middle Dot
						<td><tt lang="ja" class="char">）</tt>+<tt lang="ja" class="char">・</tt>
						<td><tt lang="ja" class="char">)</tt><tt lang="ja" class="char">・</tt>
				<tr><td scope=row>Closing&#8212;Ideographic Space
						<td><tt lang="ja" class="char">）</tt>+<tt lang="ja" class="char">　</tt>
						<td><tt lang="ja" class="char">)</tt><tt lang="ja" class="char">　</tt>
		</table>
	</div>

<h4 id="text-spacing-classes">
Text Spacing Character Classes</h4>

	In the context of this property the following definitions apply:
	
	Issue: Classes and Unicode code points need to be reviewed.

	<dl>
		<dt><dfn>ideographs</dfn>
		<dd>Includes all typographic character units [[CSS3TEXT]] whose base character is listed below:
			<ul>
				<li>All characters in the range of U+3041 to U+30FF,
					except those that belong to Unicode Punctuation [P*] category.
				<li>CJK Strokes (U+31C0 to U+31EF).
				<li>Katakana Phonetic Extensions (U+31F0 to U+31FF).
				<li>All characters that belongs to Han Unicode Script Property [[!UAX24]].
			</ul>

		<dt><dfn>ion-ideographic letters</dfn>
		<dd>
			Includes all typographic character units that
			belong to Unicode Letters [L*] and Mark [M*] category,
			except when any of the following conditions are met:
			<ul>
				<li>is defined as <a>ideograph</a>.
				<li>is categorized as East Asian Fullwidth (F) by [[!UAX11]].
				<li>is upright in vertical text flow using the 'text-orientation' property
					or the 'text-combine-upright' property.
			</ul>

		<dt><dfn>non-ideographic numerals</dfn>
		<dd>
			Includes all typographic character units that
			belong to the Unicode Decimal Digit Number [Nd] category,
			except when any of the following conditions are met:
			<ul>
				<li>is categorized as East Asian Fullwidth (F) by [[!UAX11]].
				<li>is upright in vertical text flow using the 'text-orientation' property
					or the 'text-combine-upright' property.
			</ul>

		<dt><dfn>fullwidth opening punctuation</dfn>
		<dd>
			Includes any opening punctuation character (Unicode category <code>Ps</code>)
			that belongs to the <i>CJK Symbols and Punctuation</i> block (U+3000&#8211;U+303F)
			or is categorized as <i>East Asian Fullwidth (F)</i> by [[!UAX11]].
			Also includes LEFT SINGLE QUOTATION MARK (U+2018) and LEFT DOUBLE QUOTATION MARK (U+201C).
			When trimmed, the left (for horizontal text) or top (for vertical text) half is kerned.

		<dt><dfn>fullwidth closing punctuation</dfn>
		<dd>
			Includes any closing punctuation character (Unicode category <code>Pe</code>)
			that belongs to the <i>CJK Symbols and Punctuation</i> block (U+3000&#8211;U+303F)
			or is categorized as <i>East Asian Fullwidth (F)</i> by [[!UAX11]].
			Also includes RIGHT SINGLE QUOTATION MARK (U+2019) and RIGHT DOUBLE QUOTATION MARK (U+201D).
			May also include fullwidth colon punctuation and/or fullwidth dot punctuation (see below).
			When trimmed, the right (for horizontal text) or bottom (for vertical text) half is kerned.

		<dt><dfn>fullwidth middle dot punctuation</dfn>
		<dd>
			Includes MIDDLE DOT (U+00B7), HYPHENATION POINT (U+2027), and KATAKANA MIDDLE DOT (U+30FB).
			May also include fullwidth colon punctuation and/or fullwidth dot punctuation (see below).

		<dt><dfn>fullwidth colon punctuation</dfn>
		<dd>
			Includes FULLWIDTH COLON (U+FF1A) and FULLWIDTH SEMICOLON (U+FF1B).

		<dt><dfn>fullwidth dot punctuation</dfn>
		<dd>
			Includes
			IDEOGRAPHIC COMMA (U+3001),
			IDEOGRAPHIC FULL STOP (U+3002),
			FULLWIDTH COMMA (U+FF0C),
			FULLWIDTH FULL STOP (U+FF0E).
	</dl>

	Whether fullwidth colon punctuation and fullwidth dot punctuation
	should be considered fullwidth closing punctuation or fullwidth middle dot punctuation
	depends on where in the glyph's box the punctuation is drawn.
	If the punctuation is centered,
	then it should be considered middle dot punctuation.
	If the punctuation is drawn to one side (left in horizontal text, top in vertical text)
	and the other half is therefore blank
	then the punctuation should be considered closing punctuation and trimmed accordingly.

	The UA must classify fullwidth colon punctuation and fullwidth dot punctuation
	under either the fullwidth closing punctuation category or the fullwidth middle dot punctuation category
	as appropriate.
	The UA may rely on language conventions and the writing mode (horizontal vs. vertical),
	and/or font information to determine this categorization.
	The UA may also add additional characters to any category as appropriate.

	<div class="note">
		The following informative table summarizes language conventions
		for classifying fullwidth colon and dot punctuation:

		<table class="data">
			<colgroup class="header"></colgroup>
			<colgroup span=2></colgroup>
			<thead>
				<tr><td> <th>colon punctuation <th>dot punctuation
			<tbody>
				<tr><th>Simplified Chinese (horizontal) <td>closing <td>closing
				<tr><th>Simplified Chinese (vertical) <td>closing <td>closing
				<tr><th>Traditional Chinese <td>middle dot <td>middle dot
				<tr><th>Korean <td>middle dot <td>closing
				<tr><th>Japanese <td>middle dot <td>closing
		</table>

		Note that for Chinese fonts at least,
		the author observes that the standard convention is often not followed.
	</div>

<h4 id="japanese-start-edges">
Japanese Paragraph-start Conventions in CSS</h4>

	<div class="example">
		Japanese has three common start-edge typesetting schemes,
		which are distinguished by their handling of opening brackets.
	
		<div class="figure">
			<img src="opening-brackets-at-line-head.png"
				width="646" height="360"
				alt="The first scheme aligns opening brackets flush with the indent edge
						 on the first line and with the start edge of other lines.
						 The second scheme gives the opening bracket its full width,
						 so that it is effectively indented half an em from the indent edge
						 and from the start edge of other lines.
						 The third scheme aligns the opening brackets flush with the
						 start edge of lines, but hangs them inside the indent on the
						 first line (resulting in an effective half-em indent instead
						 of the full em for paragraphs that begin with an opening bracket).">
			<p class="caption">Positioning of opening brackets at line head [[JLREQ]]
		</div>
	
		Assuming a UA style sheet of <code>p { margin: 1em 0; }</code>,
		CSS can achieve the Japanese typesetting styles with the following rules:

		<ul>
			<li>
				Brackets flush with indent, flush with other lines (first scheme):
				<pre>
					p { /* Flush alignment */
						margin: 0;
						text-indent: 1em;
						text-spacing: trim-start;
					}
				</pre>

			<li>
				Brackets preserve fullwidth spacing on all lines (second scheme):
				<pre>
					p { /* Fullwidth alignment */
						margin: 0;
						text-indent: 1em;
						text-spacing: normal;
					}
				</pre>
				
			<li>
				Brackets hang in indent, flush with other lines (third scheme):
				<pre>
					p { /* Hanging alignment */
						margin: 0;
						text-indent: 1em;
						text-spacing: trim-start;
						hanging-punctuation: first;
					}
				</pre>

		</ul>
	</div>

<h2 id="edge-effects">
Edge Effects</h2>

	<p class="note">Add final level 3 content</p>