CSS text-overflow ellipsis

HTML

<div class="container clearfix">
    <div class="row float">
        <div class="room ellipsis">
            HUMAN RESOURC/11  fgergeegergegrge          
        </div>
        <div class="cname ellipsis">
            Dave Swing
        </div>
    </div>
    <div class="row">
        <div class="subject ellipsis">
            Printer toner low on the 2nd floor printing, we need to make sure to head out that way and fix the problem.
        </div>
    </div>
</div>

<div class="container clearfix">
    <div class="row float">
        <div class="room ellipsis">
            2134-B            
        </div>
        <div class="cname ellipsis">
            ACME Widget Corp: Dave Swing
        </div>
    </div>
    <div class="row">
        <div class="subject ellipsis">
            Printer toner low on the 2nd floor printing, we need to make sure to head out that way and fix the problem.
        </div>
    </div>
</div>

<div class="container clearfix">
    <div class="row float">
        <div class="room ellipsis">
            HUMAN RESOURC/11            
        </div>
        <div class="cname ellipsis">
            ACME Widget Corp: Dave Swing
        </div>
    </div>
    <div class="row">
        <div class="subject ellipsis">
            Printer toner low on the 2nd floor printing, we need to make sure to head out that way and fix the problem.
        </div>
    </div>
</div>

<div class="container clearfix">
    <div class="row float">
        <div class="room ellipsis clip">
            HUMAN RESOURC/11            
        </div>
        <div class="cname ellipsis">
            ACME Widget Corp: Dave Swing
        </div>
    </div>
    <div class="row">
        <div class="subject ellipsis">
            Printer toner low on the 2nd floor printing, we need to make sure to head out that way and fix the problem.
        </div>
    </div>
</div>

<div class="container clearfix fixed">
    <div class="row float">
        <div class="room ellipsis">
           ...

CSS

.container {
    width: 320px;
    border: 1px solid #000;
    padding: 6px 12px;
}

.row {
    display: block;
    color: #000;
}

/* For modern browsers */
.clearfix .row:before,
.clearfix .row:after {
    content:"";
    display:table;
}
.clearfix .row:after {
    clear:both;
}

/* For IE 6/7 (trigger hasLayout) */
.clearfix .row {
    zoom:1;
}

.ellipsis {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.cname {
    color: #1199e4;
    text-decoration: underline;
}

.room {
    text-align: right;
}

.room.clip {
    max-width: 120px;
    text-overflow: clip;
}

.subject {

}


.float .cname {
    float2: left;
}

.float .room {
    float: right;
}

.subject {

}

.fixed .cname {
    width: 160px;
}

.fixed .room {
    width: 160px;
    text-align: right;
}

.table {
    display: table;
    width: 320px;
/*
    table-layout: fixed;
*/
}

.table .row {
    display: table-row;
}

.table .row > div {
    display: table-cell;
    max-width: 320px;
}

.table .row > div.cname {
    max-width: 200px;
}

.table .row > div.room {
    max-width: 120px;
    text-overflow: clip;
}