mozilla

Compare Revisions

writing-mode

Change Revisions

Revision 421719:

Revision 421719 by ethertank on

Revision 421721:

Revision 421721 by ethertank on

Title:
writing-mode
writing-mode
Slug:
Web/CSS/writing-mode
Web/CSS/writing-mode
Tags:
"css"
"css"
Content:

Revision 421719
Revision 421721
n14      A <em>writing mode</em> in CSS is determined by the <code>wn14      A <em>writing mode</em> in CSS is determined by the <code>w
>riting-mode</code>, <code>direction</code>, and <code>text-orient>riting-mode</code>, <code>direction</code>, and <code>text-orient
>ation</code> properties. It applies only to the&nbsp;<a href="htt>ation</code> properties. It applies only to the <a href="/en-US/d
>ps://developer.mozilla.org/en-US/docs/SVG/Element/text" title="ht>ocs/SVG/Element/text"><code>&lt;text&gt;</code></a> element, and 
>tps://developer.mozilla.org/en-US/docs/SVG/Element/text"><code>&l>is ignored by <code>&lt;tspan&gt;</code>, <code>&lt;tref&gt;</cod
>t;text&gt;</code></a> element, and is ignored by&nbsp;<code>&lt;t>e>, <code>&lt;altGlyph&gt;</code>, and <code>&lt;textPath&gt;</co
>span&gt;</code>, <code>&lt;tref&gt;</code>, <code>&lt;altGlyph&gt>de> sub-elements. (Note that the inline-progression-direction can
>;</code>, and <code>&lt;textPath&gt;</code> sub-elements. (Note t> change within a <code>&lt;text&gt;</code> element due to the Uni
>hat the inline-progression-direction can change within a <code>&l>code bidirectional algorithm and the <code>direction</code> and <
>t;text&gt;</code> element due to the Unicode bidirectional algori>code>unicode-bidi</code> properties.) A writing mode is defined p
>thm and the <code>direction</code> and <code>unicode-bidi</code> >rimarily in terms of its <em>inline base direction</em> and <em>b
>properties.) A writing mode is defined primarily in terms of its >lock flow direction</em>.
><em>inline base direction</em> and <em>block flow direction</em>. 
n23      In general, a&nbsp;horizontal writing mode is one with horin23      In general, a horizontal writing mode is one with horizonta
>zontal lines of text and either a downward or upward block flow; >l lines of text and either a downward or upward block flow; a ver
>a vertical writing mode is one with vertical lines of text and ei>tical writing mode is one with vertical lines of text and either 
>ther a leftward or rightward block flow.>a leftward or rightward block flow.
n34          <th scope="col" style="text-align: left;">n34          <th scope="col">
n37          <th scope="col" style="text-align: left;">n37          <th scope="col">
n40          <th scope="col" style="text-align: left;">n40          <th scope="col">
n51            Default value.&nbsp;Content flows horizontally from ln51            Default value. Content flows horizontally from left t
>eft to right, vertically from top to bottom. The next horizontal >o right, vertically from top to bottom. The next horizontal line 
>line is positioned below the previous line. <code>horizontal-tb</>is positioned below the previous line. <code>horizontal-tb</code>
>code> is the default value, as this layout is used by most writin> is the default value, as this layout is used by most writing sys
>g systems.&nbsp;For SVG1 documents only, use the deprecated value>tems. For SVG1 documents only, use the deprecated value <code>lr<
> <code>lr</code>, <code>rl</code>, or&nbsp;<code style="font-size>/code>, <code>rl</code>, or <code style="font-size: 14px; color: 
>: 14px; color: rgb(51, 51, 51);">lr-tb</code>.>rgb(51, 51, 51);">lr-tb</code>.
n76            <span style="font-family: 'Courier New', 'Andale Monon76            <code>&lt;div style="vertical-lr"&gt;...&lt;/div&gt;<
>', monospace; line-height: normal; white-space: nowrap;">&lt;div >/code>
>style="vertical-lr"&gt;...&lt;/div&gt;</span> 
n84            Content flows vertically from top to bottom, horizontn84            Content flows vertically from top to bottom, horizont
>ally from right to left.&nbsp;The next vertical line is positione>ally from right to left. The next vertical line is positioned to 
>d to the left of the previous line. For SVG1 documents only, use >the left of the previous line. For SVG1 documents only, use the d
>the deprecated value <code>tb</code> or&nbsp;<code style="font-si>eprecated value <code>tb</code> or <code>tb-rl</code>.
>ze: 14px; color: rgb(51, 51, 51);">tb-rl</code>. 
n117            Content flows horizontally from left to right, verticn117            Content flows horizontally from left to right, vertic
>ally from&nbsp;bottom to top. The next horizontal line is positio>ally from bottom to top. The next horizontal line is positioned a
>ned above the previous line.>bove the previous line.
n139            Deprecated except for SVG1 documents. For CSS, use&nbn139            Deprecated except for SVG1 documents. For CSS, use <c
>sp;<code style="font-size: 14px; color: rgb(51, 51, 51);">horizon>ode style="font-size: 14px; color: rgb(51, 51, 51);">horizontal-t
>tal-tb</code>&nbsp;(default value).&nbsp;>b</code> (default value).
n153            <span style="font-family: 'Courier New', 'Andale Monon153            <code>&lt;div style="horizontal-tb"&gt;...&lt;/div&gt
>', monospace; line-height: normal; white-space: nowrap;">&lt;div >;</code>
>style="horizontal-tb"&gt;...&lt;/div&gt;</span> 
n161            Deprecated except for SVG1 documents. For CSS, use&nbn161            Deprecated except for SVG1 documents. For CSS, use <c
>sp;<code style="font-size: 14px; color: rgb(51, 51, 51);">horizon>ode>horizontal-tb</code> (default value).
>tal-tb</code>&nbsp;(default value).&nbsp; 
n172            Deprecated except for SVG1 documents. For CSS, use&nbn172            Deprecated except for SVG1 documents. For CSS, use <c
>sp;<code style="font-size: 14px; color: rgb(51, 51, 51);">vertica>ode>vertical-rl</code>.
>l-rl</code>.&nbsp; 
n186            <span style="font-family: 'Courier New', 'Andale Monon186            <code>&lt;div style="vertical-lr"&gt;...&lt;/div&gt;<
>', monospace; line-height: normal; white-space: nowrap;">&lt;div >/code>
>style="vertical-lr"&gt;...&lt;/div&gt;</span> 
n197            <span style="font-family: 'Courier New', 'Andale Monon197            <code>&lt;div style="vertical-rl"&gt;...&lt;/div&gt;<
>', monospace; line-height: normal; white-space: nowrap;">&lt;div >/code>
>style="vertical-rl"&gt;...&lt;/div&gt;</span> 
t206      As a presentation attribute,&nbsp;<code>writing-mode</code>t206      As a presentation attribute, <code>writing-mode</code> can 
>&nbsp;can be used as a property in a CSS stylesheet. See the MDN&>be used as a property in a CSS stylesheet. See the MDN article <a
>nbsp;article&nbsp;<a href="https://developer.mozilla.org/en-US/do> href="/en-US/docs/SVG/Attribute/writing-mode">writing-mode</a> a
>cs/SVG/Attribute/writing-mode" title="https://developer.mozilla.o>nd the W3C <a href="http://dev.w3.org/csswg/css3-writing-modes/">
>rg/en-US/docs/SVG/Attribute/writing-mode">writing-mode</a>&nbsp;a>Writing Modes specification</a> for more information.
>nd the W3C&nbsp;<a href="http://dev.w3.org/csswg/css3-writing-mod 
>es/" title="http://dev.w3.org/csswg/css3-writing-modes/">Writing  
>Modes specification</a>&nbsp;for more information. 

Back to History