html - HTML / CSS省略記号（...）が機能しない

Question

省略記号を自分のサイトで機能させようとしています。これは次のHTML/CSSコードであり、機能していないようです。

CSS：

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

HTML：

<div class="oneline">Testing 123 Testing 456 Testing 789</div>

Answer 1

最初の投稿に基づいて、私たちは皆明白であると仮定していますが、念のために...;）

<style type="text/css">
    .oneline {
        text-overflow : ellipsis;
        white-space   : nowrap;
        width         : 50px;
        overflow      : hidden;
    }
</style>
<div class="oneline">Testing 123 Testing 456 Testing 789</div>

http://jsfiddle.net/NawcT/

編集：解決策は、段落とdivのスタイルを設定することでした。

Answer 2

切り捨てられる要素に割り当てるposition:absoluteと、望ましくない副作用が少なくなる可能性がありfloat:leftます。

これは私のために働いた：

div {
  position: absolute;
  width: 70px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}