ellipsis - text-overflow: 幅が不明な省略記号の使用方法

Question

これlabelは任意の幅で、CSStext-overflow:ellipsisプロパティを使用する必要があります。私はそれを機能させることができないようです。#aが設定されているため機能し、widthそれが期待される結果です。仕事に行く方法は#b？

<div id="a">
    <a href="#">link</a>
    <input type="checkbox" />
    <label>checkbox label</label>
</div>

<div id="b">
    <a href="#">link</a>
    <input type="checkbox" />
    <label>checkbox label</label>
</div>

#a       {width:100px; background:#ddd;}
#a label {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; float:right; width:50px;}
#a a     {float:right}

#b       {width:100px; background:#ddd;}
#b label {text-overflow:ellipsis; overflow:hidden; white-space:nowrap; float:right;}
#b a     {float:right}

JSFIDDLE