文本溢出校正

时间:2012-11-12 16:14:42

标签: javascript css3 css

我有一个高度有限且宽度有限的div。它应该显示数字。但由于其有限的宽度,我想剪辑其文本。但是使用“省略号”它会有问题。你可以亲自尝试。

<div id="numdiv">1000</div>


#numdiv
{
cursor:pointer;
position:relative;
top:-80px;
left:103px;
text-align:left;
font-size:15px;
height:20px;
overflow:hidden; 
white-space:nowrap; 
text-overflow:ellipsis;
 width:18px;
border:1px solid #494949;
 background:#FF9900;
-moz-border-radius:3px;
 -webkit-border-radius:3px;
 border-radius:3px;
}

要么我应该正确显示它,要么溢出的'+'符号会很好。请帮助我。我也可以使用JS来动态检查长度。我想!

1 个答案:

答案 0 :(得分:0)

而不是text-overflow: ellipsis使用:

text-overflow:clip;

见这里: http://jsbin.com/urubed/3/

修改

如果您希望它在没有JS更改position: relative的情况下动态更改为:

position: absolute;

希望这会有所帮助:)