Text clipping with ellipsis

by adamh

HTML

<p class="box">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus aliquet mi eu nunc luctus eleifend. Maecenas molestie laoreet euismod. Duis non quam ac elit ornare blandit. Praesent convallis feugiat sem vel tincidunt. Nunc vel dignissim eros. Aliquam sollicitudin molestie semper. Aenean pellentesque consectetur leo id viverra.</p>

CSS

.box {
    font-family: Helvetica, Arial;
    -o-text-overflow: ellipsis;   /* Opera */
    text-overflow:    ellipsis;   /* IE, Safari (WebKit) */
    overflow:hidden;              /* don't show excess chars */
    white-space:nowrap;           /* force single line */
    width: 200px;                 /* fixed width */
}