html - How to use text-overflow properly to format text? -
i have following html element:
<h2>download "<div id="title"></div>" for...</h2> i want insert title jquery inside <div id="title"></div> , should way:
download "the title soo long long long ..." ...
with css/less:
#title{    overflow: hidden;    text-overflow:ellipsis; } but looks way:
download "
the title soo long long long ...
" ...
i should see 1 line of text splitted title, instead see 3 lines of text. how can force place whole text 1 line? thanks!
the right way use span element, , set inline-block
http://jsbin.com/imutem/4/edit
#title{    display:inline-block;    vertical-align:bottom;    overflow: hidden;    width:200px;    white-space: nowrap;    text-overflow:ellipsis; } html:
<h2>download "<span id="title"></span>" for...</h2> 
Comments
Post a Comment