mozilla

Compare Revisions

text-overflow

Change Revisions

Revision 445725:

Revision 445725 by kscarfone on

Revision 446721:

Revision 446721 by teoli on

Title:
text-overflow
text-overflow
Slug:
Web/CSS/text-overflow
Web/CSS/text-overflow
Tags:
"NeedsMobileBrowserCompatibility", "CSS Reference", "CSS Référence", "css", "Reference", "Référence", "CSS3", "NeedsMarkupWork"
"CSS Reference", "CSS Référence", CSS3, NeedsMarkupWork, NeedsMobileBrowserCompatibility, Reference, Référence, css
Content:

Revision 445725
Revision 446721
n14      The <code>text-overflow</code> <a href="/en/CSS" title="CSSn14      The <code>text-overflow</code> <a href="/en/CSS" title="CSS
>">CSS</a> property determines how overflowed content that is not >">CSS</a> property determines how overflowed content that is not 
>displayed is signaled to the users. It can be clipped, or display>displayed is signaled to the users. It can be clipped, or display
> an ellipsis ('<code>…</code>', <code style="text-transform:upper> an ellipsis ('<code>…</code>', <code style="text-transform: uppe
>case">U+2026 Horizontal Ellipsis</code>) or a Web author-defined >rcase;">U+2026 Horizontal Ellipsis</code>) or a Web author-define
>string.>d string.
n65        This keyword value indicates to display an ellipsis (<codn65        This keyword value indicates to display an ellipsis (<cod
>e>'…'</code>, <code style="text-transform:uppercase">U+2026 Horiz>e>'…'</code>, <code style="text-transform: uppercase;">U+2026 Hor
>ontal Ellipsis</code>) to represent clipped text. The ellipsis is>izontal Ellipsis</code>) to represent clipped text. The ellipsis 
> displayed inside the <a href="/en/CSS/box_model" title="en/CSS/B>is displayed inside the <a href="/en/CSS/box_model" title="en/CSS
>ox_model">content area</a>, decreasing the amount of text display>/Box_model">content area</a>, decreasing the amount of text displ
>ed. If there is not enough space to display the ellipsis, it is c>ayed. If there is not enough space to display the ellipsis, it is
>lipped.> clipped.
n92          <th colspan="2" rowspan="1" scope="col" style="text-alin92          <th colspan="2" rowspan="1" scope="col" style="text-ali
>gn:center;">>gn: center;">
n95          <th colspan="2" rowspan="1" scope="col" style="text-alin95          <th colspan="2" rowspan="1" scope="col" style="text-ali
>gn:center;">>gn: center;">
n119          <td style="font-family:monospace;">n119          <td style="font-family: monospace;">
n122          <td style="direction:ltr;">n122          <td style="direction: ltr;">
123            <div style="float:left;font-family:monospace;white-sp123            <div style="float: left; font-family: monospace; whit
>ace:nowrap;max-width:3.35em;overflow:visible;">>e-space: nowrap; max-width: 3.35em; overflow: visible;">
124              <span style="unicode-bidi:bidi-override;direction:l124              <span style="unicode-bidi: bidi-override; direction
>tr;margin:0 -2px">1234567890</span>>: ltr; margin: 0 -2px;">1234567890</span>
125            </div>
126          </td>125            </div>
126          </td>
127          <td style="font-family:monospace;">127          <td style="font-family: monospace;">
n131            <div style="font-family:monospace;white-space:nowrap;n131            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:visible">>ap; max-width: 3.35em; overflow: visible;">
132              <span style="unicode-bidi:bidi-override;direction:r132              <span style="unicode-bidi: bidi-override; direction
>tl;margin:0 -2px">1234567890</span>>: rtl; margin: 0 -2px;">1234567890</span>
n140          <td style="padding:1px;font-family:monospace;">n140          <td style="padding: 1px; font-family: monospace;">
n143          <td style="direction:ltr;">n143          <td style="direction: ltr;">
144            <div style="float:left;font-family:monospace;white-sp144            <div style="float: left; font-family: monospace; whit
>ace:nowrap;max-width:3.35em;overflow:hidden;text-overflow:clip;">>e-space: nowrap; max-width: 3.35em; overflow: hidden; text-overfl
 >ow: clip;">
n148          <td style="padding:1px;font-family:monospace;">n148          <td style="padding: 1px; font-family: monospace;">
n151          <td style="direction:rtl;">n151          <td style="direction: rtl;">
152            <div style="font-family:monospace;white-space:nowrap;152            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:clip;">>ap; max-width: 3.35em; overflow: hidden; text-overflow: clip;">
153              <span style="unicode-bidi:bidi-override;direction:r153              <span style="unicode-bidi: bidi-override; direction
>tl;margin:0 -2px">1234567890</span>>: rtl; margin: 0 -2px;">1234567890</span>
n161          <td style="font-family:monospace;">n161          <td style="font-family: monospace;">
n164          <td style="direction:ltr;">n164          <td style="direction: ltr;">
165            <div style="float:left;font-family:monospace;white-sp165            <div style="float: left; font-family: monospace; whit
>ace:nowrap;max-width:3.35em;overflow:hidden;text-overflow:'';">>e-space: nowrap; max-width: 3.35em; overflow: hidden; text-overfl
 >ow: '';">
n169          <td style="font-family:monospace;">n169          <td style="font-family: monospace;">
n172          <td style="direction:rtl;">n172          <td style="direction: rtl;">
173            <div style="font-family:monospace;white-space:nowrap;173            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:'';">>ap; max-width: 3.35em; overflow: hidden; text-overflow: '';">
174              <span style="unicode-bidi:bidi-override;direction:r174              <span style="unicode-bidi: bidi-override; direction
>tl;margin:0 -2px">1234567890</span>>: rtl; margin: 0 -2px;">1234567890</span>
n182          <td style="font-family:monospace;">n182          <td style="font-family: monospace;">
n185          <td style="direction:ltr;">n185          <td style="direction: ltr;">
186            <div style="font-family:monospace;white-space:nowrap;186            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:ellipsis;">>ap; max-width: 3.35em; overflow: hidden; text-overflow: ellipsis;
 >">
187              <span style="unicode-bidi:bidi-override;direction:l187              <span style="unicode-bidi: bidi-override; direction
>tr;margin:0 -2px">1234567890</span>>: ltr; margin: 0 -2px;">1234567890</span>
188            </div>
189          </td>188            </div>
189          </td>
190          <td style="font-family:monospace;">190          <td style="font-family: monospace;">
n193          <td style="direction:rtl;">n193          <td style="direction: rtl;">
194            <div style="font-family:monospace;white-space:nowrap;194            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:ellipsis;">>ap; max-width: 3.35em; overflow: hidden; text-overflow: ellipsis;
 >">
195              <span style="unicode-bidi:bidi-override;direction:r195              <span style="unicode-bidi: bidi-override; direction
>tl;margin:0 -2px">1234567890</span>>: rtl; margin: 0 -2px;">1234567890</span>
n203          <td style="font-family:monospace;">n203          <td style="font-family: monospace;">
n206          <td style="direction:ltr;">n206          <td style="direction: ltr;">
207            <div style="font-family:monospace;white-space:nowrap;207            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:'.';">>ap; max-width: 3.35em; overflow: hidden; text-overflow: '.';">
208              <span style="unicode-bidi:bidi-override;direction:l208              <span style="unicode-bidi: bidi-override; direction
>tr;margin:0 -2px">1234567890</span>>: ltr; margin: 0 -2px;">1234567890</span>
209            </div>
210          </td>209            </div>
210          </td>
211          <td style="font-family:monospace;">211          <td style="font-family: monospace;">
n214          <td style="direction:rtl;">n214          <td style="direction: rtl;">
215            <div style="font-family:monospace;white-space:nowrap;215            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:'.';">>ap; max-width: 3.35em; overflow: hidden; text-overflow: '.';">
216              <span style="unicode-bidi:bidi-override;direction:r216              <span style="unicode-bidi: bidi-override; direction
>tl;margin:0 -2px">1234567890</span>>: rtl; margin: 0 -2px;">1234567890</span>
n224          <td style="font-family:monospace;">n224          <td style="font-family: monospace;">
n227          <td style="direction:ltr;">n227          <td style="direction: ltr;">
228            <div style="font-family:monospace;white-space:nowrap;228            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:clip clip;">>ap; max-width: 3.35em; overflow: hidden; text-overflow: clip clip
 >;">
229              <span style="unicode-bidi:bidi-override;direction:l229              <span style="unicode-bidi: bidi-override; direction
>tr;margin:0 -2px">1234567890</span>>: ltr; margin: 0 -2px;">1234567890</span>
230            </div>
231          </td>230            </div>
231          </td>
232          <td style="font-family:monospace;">232          <td style="font-family: monospace;">
n235          <td style="direction:rtl;">n235          <td style="direction: rtl;">
236            <div style="font-family:monospace;white-space:nowrap;236            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:clip clip;">>ap; max-width: 3.35em; overflow: hidden; text-overflow: clip clip
 >;">
237              <span style="unicode-bidi:bidi-override;direction:r237              <span style="unicode-bidi: bidi-override; direction
>tl;margin:0 -2px">1234567890</span>>: rtl; margin: 0 -2px;">1234567890</span>
n245          <td style="font-family:monospace;">n245          <td style="font-family: monospace;">
n248          <td style="direction:ltr;">n248          <td style="direction: ltr;">
249            <div style="font-family:monospace;white-space:nowrap;249            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:clip ellipsis;">>ap; max-width: 3.35em; overflow: hidden; text-overflow: clip elli
 >psis;">
250              <span style="unicode-bidi:bidi-override;direction:l250              <span style="unicode-bidi: bidi-override; direction
>tr;margin:0 -2px">1234567890</span>>: ltr; margin: 0 -2px;">1234567890</span>
251            </div>
252          </td>251            </div>
252          </td>
253          <td style="font-family:monospace;">253          <td style="font-family: monospace;">
n256          <td style="direction:rtl;">n256          <td style="direction: rtl;">
257            <div style="font-family:monospace;white-space:nowrap;257            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:clip ellipsis;">>ap; max-width: 3.35em; overflow: hidden; text-overflow: clip elli
 >psis;">
258              <span style="unicode-bidi:bidi-override;direction:r258              <span style="unicode-bidi: bidi-override; direction
>tl;margin:0 -2px">1234567890</span>>: rtl; margin: 0 -2px;">1234567890</span>
n266          <td style="font-family:monospace;">n266          <td style="font-family: monospace;">
n269          <td style="direction:ltr;">n269          <td style="direction: ltr;">
270            <div style="font-family:monospace;white-space:nowrap;270            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:clip '.';">>ap; max-width: 3.35em; overflow: hidden; text-overflow: clip '.';
 >">
271              <span style="unicode-bidi:bidi-override;direction:l271              <span style="unicode-bidi: bidi-override; direction
>tr;margin:0 -2px">1234567890</span>>: ltr; margin: 0 -2px;">1234567890</span>
272            </div>
273          </td>272            </div>
273          </td>
274          <td style="font-family:monospace;">274          <td style="font-family: monospace;">
n277          <td style="direction:rtl;">n277          <td style="direction: rtl;">
278            <div style="font-family:monospace;white-space:nowrap;278            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:clip '.';">>ap; max-width: 3.35em; overflow: hidden; text-overflow: clip '.';
 >">
279              <span style="unicode-bidi:bidi-override;direction:r279              <span style="unicode-bidi: bidi-override; direction
>tl;margin:0 -2px">1234567890</span>>: rtl; margin: 0 -2px;">1234567890</span>
n287          <td style="font-family:monospace;">n287          <td style="font-family: monospace;">
n290          <td style="direction:ltr;">n290          <td style="direction: ltr;">
291            <div style="font-family:monospace;white-space:nowrap;291            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:ellipsis clip;">>ap; max-width: 3.35em; overflow: hidden; text-overflow: ellipsis 
 >clip;">
292              <span style="unicode-bidi:bidi-override;direction:l292              <span style="unicode-bidi: bidi-override; direction
>tr;margin:0 -2px">1234567890</span>>: ltr; margin: 0 -2px;">1234567890</span>
293            </div>
294          </td>293            </div>
294          </td>
295          <td style="font-family:monospace;">295          <td style="font-family: monospace;">
n298          <td style="direction:rtl;">n298          <td style="direction: rtl;">
299            <div style="font-family:monospace;white-space:nowrap;299            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:ellipsis clip;">>ap; max-width: 3.35em; overflow: hidden; text-overflow: ellipsis 
 >clip;">
300              <span style="unicode-bidi:bidi-override;direction:r300              <span style="unicode-bidi: bidi-override; direction
>tl;margin:0 -2px">1234567890</span>>: rtl; margin: 0 -2px;">1234567890</span>
n308          <td style="font-family:monospace;">n308          <td style="font-family: monospace;">
n311          <td style="direction:ltr;">n311          <td style="direction: ltr;">
312            <div style="font-family:monospace;white-space:nowrap;312            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:ellipsis ellipsis;>ap; max-width: 3.35em; overflow: hidden; text-overflow: ellipsis 
>">>ellipsis;">
313              <span style="unicode-bidi:bidi-override;direction:l313              <span style="unicode-bidi: bidi-override; direction
>tr;margin:0 -2px">1234567890</span>>: ltr; margin: 0 -2px;">1234567890</span>
314            </div>
315          </td>314            </div>
315          </td>
316          <td style="font-family:monospace;">316          <td style="font-family: monospace;">
n319          <td style="direction:rtl;">n319          <td style="direction: rtl;">
320            <div style="font-family:monospace;white-space:nowrap;320            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:ellipsis ellipsis;>ap; max-width: 3.35em; overflow: hidden; text-overflow: ellipsis 
>">>ellipsis;">
321              <span style="unicode-bidi:bidi-override;direction:r321              <span style="unicode-bidi: bidi-override; direction
>tl;margin:0 -2px">1234567890</span>>: rtl; margin: 0 -2px;">1234567890</span>
n329          <td style="font-family:monospace;">n329          <td style="font-family: monospace;">
n332          <td style="direction:ltr;">n332          <td style="direction: ltr;">
333            <div style="font-family:monospace;white-space:nowrap;333            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:ellipsis '.';">>ap; max-width: 3.35em; overflow: hidden; text-overflow: ellipsis 
 >'.';">
334              <span style="unicode-bidi:bidi-override;direction:l334              <span style="unicode-bidi: bidi-override; direction
>tr;margin:0 -2px">1234567890</span>>: ltr; margin: 0 -2px;">1234567890</span>
335            </div>
336          </td>335            </div>
336          </td>
337          <td style="font-family:monospace;">337          <td style="font-family: monospace;">
n340          <td style="direction:rtl;">n340          <td style="direction: rtl;">
341            <div style="font-family:monospace;white-space:nowrap;341            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:ellipsis '.';">>ap; max-width: 3.35em; overflow: hidden; text-overflow: ellipsis 
 >'.';">
342              <span style="unicode-bidi:bidi-override;direction:r342              <span style="unicode-bidi: bidi-override; direction
>tl;margin:0 -2px">1234567890</span>>: rtl; margin: 0 -2px;">1234567890</span>
n350          <td style="font-family:monospace;">n350          <td style="font-family: monospace;">
n353          <td style="direction:ltr;">n353          <td style="direction: ltr;">
354            <div style="font-family:monospace;white-space:nowrap;354            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:',' clip;">>ap; max-width: 3.35em; overflow: hidden; text-overflow: ',' clip;
 >">
355              <span style="unicode-bidi:bidi-override;direction:l355              <span style="unicode-bidi: bidi-override; direction
>tr;margin:0 -2px">1234567890</span>>: ltr; margin: 0 -2px;">1234567890</span>
356            </div>
357          </td>356            </div>
357          </td>
358          <td style="font-family:monospace;">358          <td style="font-family: monospace;">
n361          <td style="direction:rtl;">n361          <td style="direction: rtl;">
362            <div style="font-family:monospace;white-space:nowrap;362            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:',' clip;">>ap; max-width: 3.35em; overflow: hidden; text-overflow: ',' clip;
 >">
363              <span style="unicode-bidi:bidi-override;direction:r363              <span style="unicode-bidi: bidi-override; direction
>tl;margin:0 -2px">1234567890</span>>: rtl; margin: 0 -2px;">1234567890</span>
n371          <td style="font-family:monospace;">n371          <td style="font-family: monospace;">
n374          <td style="direction:ltr;">n374          <td style="direction: ltr;">
375            <div style="font-family:monospace;white-space:nowrap;375            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:','ellipsis;">>ap; max-width: 3.35em; overflow: hidden; text-overflow: ','ellips
 >is;">
376              <span style="unicode-bidi:bidi-override;direction:l376              <span style="unicode-bidi: bidi-override; direction
>tr;margin:0 -2px">1234567890</span>>: ltr; margin: 0 -2px;">1234567890</span>
377            </div>
378          </td>377            </div>
378          </td>
379          <td style="font-family:monospace;">379          <td style="font-family: monospace;">
n382          <td style="direction:rtl;">n382          <td style="direction: rtl;">
383            <div style="font-family:monospace;white-space:nowrap;383            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:','ellipsis;">>ap; max-width: 3.35em; overflow: hidden; text-overflow: ','ellips
 >is;">
384              <span style="unicode-bidi:bidi-override;direction:r384              <span style="unicode-bidi: bidi-override; direction
>tl;margin:0 -2px">1234567890</span>>: rtl; margin: 0 -2px;">1234567890</span>
n392          <td style="font-family:monospace;">n392          <td style="font-family: monospace;">
n395          <td style="direction:ltr;">n395          <td style="direction: ltr;">
396            <div style="font-family:monospace;white-space:nowrap;396            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:',' '.';">>ap; max-width: 3.35em; overflow: hidden; text-overflow: ',' '.';"
 >>
397              <span style="unicode-bidi:bidi-override;direction:l397              <span style="unicode-bidi: bidi-override; direction
>tr;margin:0 -2px">1234567890</span>>: ltr; margin: 0 -2px;">1234567890</span>
398            </div>
399          </td>398            </div>
399          </td>
400          <td style="font-family:monospace;">400          <td style="font-family: monospace;">
t403          <td style="direction:rtl;">t403          <td style="direction: rtl;">
404            <div style="font-family:monospace;white-space:nowrap;404            <div style="font-family: monospace; white-space: nowr
>max-width:3.35em;overflow:hidden;text-overflow:',' '.';">>ap; max-width: 3.35em; overflow: hidden; text-overflow: ',' '.';"
 >>
405              <span style="unicode-bidi:bidi-override;direction:r405              <span style="unicode-bidi: bidi-override; direction
>tl;margin:0 -2px">1234567890</span>>: rtl; margin: 0 -2px;">1234567890</span>

Back to History