CSS3 Text-overflow Properties

Page:

    <ul>        <Li>· Test testing Test testing test test testing</Li>        <Li>· Test testing Test testing test test testing</Li>        <Li>· Test testing Test testing test test testing</Li>        <Li>· Test testing Test testing test test testing</Li>        <Li>· Test testing Test testing test test testing</Li>    </ul>

Css:

Li{Line-height:22px;font-size:12px;Border-bottom:1px solid #ccc;width:120px;/*Set Width*/Overflow:Hidden;/*overflow content set to hidden*/White-space:nowrap;/*force Text line display*/Text-overflow:ellipsis;/*set overflow text to appear as omitted marker*/}

Effect:

Note: It is not sufficient to set the Text-overflow attribute only in the above example. You must set the width of the text perimeter, the overflow content to be hidden (Overflow:hidden), the Force text line display (white-space:nowrap), so that the Text-overflow property value is set ellipsis to show the effect of omitting the mark.

CSS3 Text-overflow Properties