html - text-overflow: Chrome の div を含む div で省略記号が機能しない

Question

すべてのテキストを「...」で終わらせたいのですが、それは内側の div に対してのみ機能します。

div {
  border: solid 2px blue;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 40px;
}

<div>Test test test test test test
  <div>asdasdasdasdasd</div>
</div>

http://jsfiddle.net/JU8Up/

外側のdivに含まれるテキストも「...」を取得するような解決策はありますか?

編集：クロムの問題のようですが、以下の回答の修正は引き続き機能します

Answer 1

div CSS に追加float: left;することで機能しますが、それ以上のコンテキストがなければ、実装にどのような副作用があるかについてコメントすることはできません。

例はこちら。