appliquer des points de suspension lorsque le texte de l'étiquette est de débordement

En-dessous de conception html, je veux appliquer le texte,-le débordement des points de suspension pour les médias-joué et remarques de l'étiquette et souhaitez que les médias ont joué (première grande ligne) sur la première ligne et remarques (deuxième bing ligne) serait aller sur la ligne suivante. La lecture et d'Arrêt et les médias ont joué et remarques devraient tombons tous dans la même ligne. Pouvez-vous svp m'aider?

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

#player-play, #player-stop
{
   display: inline-block;
   width: 48px;
   height: 48px;
}
#player-play
{
    background-image: url('../images/play.png');
}
#player-stop
{
   background-image: url('../images/stop.png');
}


 <div  id="player" data-role="header">
        <div data-role="navbar">
            <ul>
                <li class="oneline">
                    <a href="#" id="player-play" title="Play /Pause" style="float:left" ></a>
                    <a href="#" id="player-stop" title="Stop" style="float:left" ></a>
                    <label id="media-played" class="oneline">first big line first bing line first bing line first big line</label>
                    <label id="remarks">second big line second big line second big line second big line</label>
                </li>
            </ul>
        </div>
            <div data-role="navbar">
                <ul>
                    <li>
                        <input type="range" id="time-slider" data-highlight="true" step=".1" data-mini="true" min="0" max="5.40" value="3.4" disabled>
                    </li>
                </ul>
        </div>
    </div>
C'est l'utilisation trompeuse de la label élément. Il est destiné à être utilisé comme étiquette pour un contrôle comme un input élément, et il peut avoir une aide particulière pour les agents utilisateurs sur cette base. Juste pour afficher des textes, l'utilisation span ou, si elles doivent apparaître comme un bloc, comme probablement ici, div éléments; à l'aide de div fait display: block inutiles.

OriginalL'auteur user845392 | 2013-08-06

  1. 9

    Nouveau CSS:

    #media-played,#remarks {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display:block;
}

#player-play, #player-stop
{
   display: inline-block;
   width: 48px;
   height: 48px;
}
#player-play
{
    background-image: url('../images/play.png');
}
#player-stop
{
   background-image: url('../images/stop.png');
}

    jsFiddle:http://jsfiddle.net/dTffH/

    OriginalL'auteur Robert McKee