0

text-overflow と overflow hidden を使用すると、IE8 で問題が発生します。IE8 はテキストを正しくトリミングし、そのオーバーフローをビューから非表示にしますが、切り捨てられたテキストを含むスパンは依然として親要素の幅を広げます。

スパンまたはその親要素のいずれかで固定幅を使用すると問題なく動作しますが、残念ながら固定幅は使用できません。切り捨てたスパン要素で width:100% と max-width を使用し、親要素に max-width を配置しようとしましたが、IE8 では運がありませんでした。

どんな提案でも非常に役に立ちます。

ここでフィドル：

http://jsfiddle.net/cmoeser/aRvXg/

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
</head>
<style type="text/css">

.containerDiv {
    float:right;
    border:1px solid green;
    overflow:hidden!important;
    zoom:1;
}
.textDiv {
     float:left;
     zoom:1;
     white-space: nowrap;
     display:block;
     max-width:128px;
     overflow:hidden;
     -ms-text-overflow: ellipsis;
     text-overflow:ellipsis;   
}
</style>
<body>
    <div class="containerDiv">
        <span class="textDiv">WWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWW</span>
    </div>
</body>
</html>

ここに画像の説明を入力

4

1 に答える 1

0

試してみたらどうですか

 .textdiv {float:right; text-align:left;}

IE8 で js フィドルを使用できません

于 2013-03-30T22:20:31.793 に答える