Skip to content

Commit f6260f1

Browse files
fantasaifantasai
committed
Shift Edge Effects section up closer to Spacing, since its more related. No other changes.
1 parent 0652e75 commit f6260f1

1 file changed

Lines changed: 146 additions & 145 deletions

File tree

‎css3-text/Overview.src.html‎

Lines changed: 146 additions & 145 deletions
Original file line numberDiff line numberDiff line change
@@ -2328,6 +2328,151 @@ <h3 id="text-autospace"><span class="secno">7.4.</span>
23282328
and CJK Compatibility Ideograph (U+2F800 to U+2FA1D).</li>
23292329
</ul>
23302330

2331+
<h2 id="edge-effects"><span class="secno">9.</span>
2332+
Edge Effects</h2>
2333+
2334+
<h3 id="text-indent"><span class="secno">9.1</span>
2335+
First Line Indentation: the 'text-indent' property</h3>
2336+
2337+
<table class="propdef">
2338+
<tbody>
2339+
<tr>
2340+
<th>Name:</th>
2341+
<td><dfn>text-indent</dfn></td>
2342+
</tr>
2343+
<tr>
2344+
<th>Value:</th>
2345+
<td>[ <span class="value-inst-length"><a href="http://www.w3.org/TR/CSS21/syndata.html#value-def-length">&lt;length&gt;</a></span>
2346+
| <span class="value-inst-percentage"><a href="http://www.w3.org/TR/CSS21/syndata.html#value-def-percentage">&lt;percentage&gt;</a></span>
2347+
] hanging?
2348+
</td>
2349+
</tr>
2350+
<tr>
2351+
<th>Initial:</th>
2352+
<td>0</td>
2353+
</tr>
2354+
<tr>
2355+
<th>Applies to:</th>
2356+
<td>block-level, inline-block elements and table cells</td>
2357+
</tr>
2358+
<tr>
2359+
<th>Inherited:</th>
2360+
<td>yes</td>
2361+
</tr>
2362+
<tr>
2363+
<th>Percentages:</th>
2364+
<td>refers to width of containing block</td>
2365+
</tr>
2366+
<tr>
2367+
<th>Media:</th>
2368+
<td>visual</td>
2369+
</tr>
2370+
<tr>
2371+
<th>Computed&#160;value:</th>
2372+
<td>the percentage as specified or the absolute length</td>
2373+
</tr>
2374+
</tbody>
2375+
</table>
2376+
2377+
<p>This property specifies the indentation applied to lines of inline
2378+
content in a block. The indentation only affects the first line of
2379+
inline content in the block unless the 'hanging' keyword is specified,
2380+
in which case it affects all lines except the first.</p>
2381+
2382+
<p>The indent is treated as a margin applied to the start edge of the
2383+
line box. The amount of indentation is given by the length or percentage
2384+
value. Percentages are relative to the containing block, even in the
2385+
presence of floats. They are inherited as percentages, not as absolute
2386+
lengths.</p>
2387+
2388+
<div class="example">
2389+
<p>If 'text-align' is 'start' and 'text-indent' is '5em' in
2390+
left-to-right text with no floats present, then first line of text
2391+
will start 5em into the block:</p>
2392+
2393+
<pre><!--
2394+
--> Since CSS1 it has been possible
2395+
<!-- -->to indent the first line of a block
2396+
<!-- -->element using the 'text-indent'
2397+
<!-- -->property.<!--
2398+
--></pre>
2399+
</div>
2400+
2401+
<p class="note">Note that since the 'text-indent' property inherits,
2402+
when specified on a block element, it will affect descendant
2403+
inline-block elements.
2404+
For this reason, it is often wise to specify 'text-indent: 0' on
2405+
elements that are specified 'display: inline-block'.</p>
2406+
2407+
<h3 id="hanging-punctuation"><span class="secno">9.2</span>
2408+
Hanging Punctuation: the 'hanging-punctuation' property</h3>
2409+
2410+
<table class="propdef">
2411+
<tbody>
2412+
<tr>
2413+
<th>Name:</th>
2414+
<td><dfn>hanging-punctuation</dfn></td>
2415+
</tr>
2416+
<tr>
2417+
<th>Value:</th>
2418+
<td>none | [ first || last || [ allow-end | force-end ] ]
2419+
</td>
2420+
</tr>
2421+
<tr>
2422+
<th>Initial:</th>
2423+
<td>none</td>
2424+
</tr>
2425+
<tr>
2426+
<th>Applies to:</th>
2427+
<td>all elements</td>
2428+
</tr>
2429+
<tr>
2430+
<th>Inherited:</th>
2431+
<td>yes</td>
2432+
</tr>
2433+
<tr>
2434+
<th>Percentages:</th>
2435+
<td>N/A</td>
2436+
</tr>
2437+
<tr>
2438+
<th>Media:</th>
2439+
<td>visual</td>
2440+
</tr>
2441+
<tr>
2442+
<th>Computed&#160;value:</th>
2443+
<td>as specified</td>
2444+
</tr>
2445+
</tbody>
2446+
</table>
2447+
2448+
<p>This property determines whether a punctuation mark, if one is present,
2449+
may be placed outside the line box at the start or at the end of a
2450+
full line of text.
2451+
Values have the following meanings:</p>
2452+
2453+
<dl>
2454+
<dt><dfn title="hanging-punctuation:first"><code>first</code></dfn></dt>
2455+
<dd>Punctuation (specifically, opening brackets and quotes) may hang
2456+
outside the start edge of the first line.</dd>
2457+
<dt><dfn title="hanging-punctuation:last"><code>last</code></dfn></dt>
2458+
<dd>Punctuation (specifcally, closing brackets and quotes) may hang
2459+
outside the end edge of the last line.</dd>
2460+
<dt><dfn title="hanging-punctuation:allow-end"><code>allow-end</code></dfn></dt>
2461+
<dd>Punctuation (specifically, stops and commas) may hang outside the
2462+
end edge of all lines if the punctuation does not otherwise fit
2463+
prior to justification.</dd>
2464+
<dt><dfn title="hanging-punctuation:force-end"><code>force-end</code></dfn></dt>
2465+
<dd>Punctuation (specifically, stops and commas) may hang outside the
2466+
end edge of all lines. If justification is enabled on this line, then
2467+
it will force the punctuation to hang.</dd>
2468+
</dl>
2469+
2470+
<p>In all cases only one punctuation character may hang outside the edge
2471+
of the line. </p>
2472+
2473+
<p class="issue">Need to work on the description.
2474+
Cover indentation as well. Check for Western use-cases.</p>
2475+
23312476
<h2 id="decoration"><span class="secno">8.</span>
23322477
<a name="text-decoration">Text Decoration</a></h2>
23332478

@@ -3284,151 +3429,7 @@ <h3 id="text-outline"><span class="secno">8.4</span>
32843429
the outline effect. The color value will be used as the color of the
32853430
outline.</p>
32863431

3287-
<h2 id="edge-effects"><span class="secno">9.</span>
3288-
Edge Effects</h2>
3289-
3290-
<h3 id="text-indent"><span class="secno">9.1</span>
3291-
First Line Indentation: the 'text-indent' property</h3>
3292-
3293-
<table class="propdef">
3294-
<tbody>
3295-
<tr>
3296-
<th>Name:</th>
3297-
<td><dfn>text-indent</dfn></td>
3298-
</tr>
3299-
<tr>
3300-
<th>Value:</th>
3301-
<td>[ <span class="value-inst-length"><a href="http://www.w3.org/TR/CSS21/syndata.html#value-def-length">&lt;length&gt;</a></span>
3302-
| <span class="value-inst-percentage"><a href="http://www.w3.org/TR/CSS21/syndata.html#value-def-percentage">&lt;percentage&gt;</a></span>
3303-
] hanging?
3304-
</td>
3305-
</tr>
3306-
<tr>
3307-
<th>Initial:</th>
3308-
<td>0</td>
3309-
</tr>
3310-
<tr>
3311-
<th>Applies to:</th>
3312-
<td>block-level, inline-block elements and table cells</td>
3313-
</tr>
3314-
<tr>
3315-
<th>Inherited:</th>
3316-
<td>yes</td>
3317-
</tr>
3318-
<tr>
3319-
<th>Percentages:</th>
3320-
<td>refers to width of containing block</td>
3321-
</tr>
3322-
<tr>
3323-
<th>Media:</th>
3324-
<td>visual</td>
3325-
</tr>
3326-
<tr>
3327-
<th>Computed&#160;value:</th>
3328-
<td>the percentage as specified or the absolute length</td>
3329-
</tr>
3330-
</tbody>
3331-
</table>
3332-
3333-
<p>This property specifies the indentation applied to lines of inline
3334-
content in a block. The indentation only affects the first line of
3335-
inline content in the block unless the 'hanging' keyword is specified,
3336-
in which case it affects all lines except the first.</p>
3337-
3338-
<p>The indent is treated as a margin applied to the start edge of the
3339-
line box. The amount of indentation is given by the length or percentage
3340-
value. Percentages are relative to the containing block, even in the
3341-
presence of floats. They are inherited as percentages, not as absolute
3342-
lengths.</p>
3343-
3344-
<div class="example">
3345-
<p>If 'text-align' is 'start' and 'text-indent' is '5em' in
3346-
left-to-right text with no floats present, then first line of text
3347-
will start 5em into the block:</p>
3348-
3349-
<pre><!--
3350-
--> Since CSS1 it has been possible
3351-
<!-- -->to indent the first line of a block
3352-
<!-- -->element using the 'text-indent'
3353-
<!-- -->property.<!--
3354-
--></pre>
3355-
</div>
3356-
3357-
<p class="note">Note that since the 'text-indent' property inherits,
3358-
when specified on a block element, it will affect descendant
3359-
inline-block elements.
3360-
For this reason, it is often wise to specify 'text-indent: 0' on
3361-
elements that are specified 'display: inline-block'.</p>
3362-
3363-
<h3 id="hanging-punctuation"><span class="secno">9.2</span>
3364-
Hanging Punctuation: the 'hanging-punctuation' property</h3>
3365-
3366-
<table class="propdef">
3367-
<tbody>
3368-
<tr>
3369-
<th>Name:</th>
3370-
<td><dfn>hanging-punctuation</dfn></td>
3371-
</tr>
3372-
<tr>
3373-
<th>Value:</th>
3374-
<td>none | [ first || last || [ allow-end | force-end ] ]
3375-
</td>
3376-
</tr>
3377-
<tr>
3378-
<th>Initial:</th>
3379-
<td>none</td>
3380-
</tr>
3381-
<tr>
3382-
<th>Applies to:</th>
3383-
<td>all elements</td>
3384-
</tr>
3385-
<tr>
3386-
<th>Inherited:</th>
3387-
<td>yes</td>
3388-
</tr>
3389-
<tr>
3390-
<th>Percentages:</th>
3391-
<td>N/A</td>
3392-
</tr>
3393-
<tr>
3394-
<th>Media:</th>
3395-
<td>visual</td>
3396-
</tr>
3397-
<tr>
3398-
<th>Computed&#160;value:</th>
3399-
<td>as specified</td>
3400-
</tr>
3401-
</tbody>
3402-
</table>
3403-
3404-
<p>This property determines whether a punctuation mark, if one is present,
3405-
may be placed outside the line box at the start or at the end of a
3406-
full line of text.
3407-
Values have the following meanings:</p>
3408-
3409-
<dl>
3410-
<dt><dfn title="hanging-punctuation:first"><code>first</code></dfn></dt>
3411-
<dd>Punctuation (specifically, opening brackets and quotes) may hang
3412-
outside the start edge of the first line.</dd>
3413-
<dt><dfn title="hanging-punctuation:last"><code>last</code></dfn></dt>
3414-
<dd>Punctuation (specifcally, closing brackets and quotes) may hang
3415-
outside the end edge of the last line.</dd>
3416-
<dt><dfn title="hanging-punctuation:allow-end"><code>allow-end</code></dfn></dt>
3417-
<dd>Punctuation (specifically, stops and commas) may hang outside the
3418-
end edge of all lines if the punctuation does not otherwise fit
3419-
prior to justification.</dd>
3420-
<dt><dfn title="hanging-punctuation:force-end"><code>force-end</code></dfn></dt>
3421-
<dd>Punctuation (specifically, stops and commas) may hang outside the
3422-
end edge of all lines. If justification is enabled on this line, then
3423-
it will force the punctuation to hang.</dd>
3424-
</dl>
3425-
3426-
<p>In all cases only one punctuation character may hang outside the edge
3427-
of the line. </p>
3428-
3429-
<p class="issue">Need to work on the description.
3430-
Cover indentation as well. Check for Western use-cases.</p>
3431-
3432+
<h2 id="ui">This section should move to CSS3 UI</h2>
34323433
<h3 id="text-overflow"><a name="text-overflow-props"></a><a name="text-overflow-mode"></a><a name="text-overflow-ellipsis"></a><a name="ellipsis-def"></a>
34333434
<span class="secno">9.3</span>
34343435
Overflow Ellipsis: the 'text-overflow' property</h3>

0 commit comments

Comments
 (0)