使用文本溢出和隐藏溢出时,我在 IE8 中遇到问题。尽管 IE8 正确地修剪了文本并从视图中隐藏了它的溢出,但带有截断文本的 span 仍然超出了父元素的宽度。
在跨度或其父元素上使用固定宽度可以正常工作,但不幸的是我不能使用固定宽度。我尝试在截断跨度元素上使用 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>