css3 - text-overflow: ellipsis is displaying different character -



css3 - text-overflow: ellipsis is displaying different character -

i've got bit of css problem here.

see image

in image added css styles text "intense training"

.sample-style{ width: 100%; overflow: hidden !important; text-overflow: ellipsis; white-space: nowrap; }

the problem when add together

text-overflow: ellipsis;

it displays big o 2 dots on top instead of "...". can tell me going on here? tried code other project , works.

this markup:

<div class="panel radius panel-click"> <a href="#" data-dropdown="drop1" class="tiny right dropdown" data-options="align:left;"><i class="fi-wrench"></i></a> <div class="large-12"> <h1 class="panel-title text-upper"><small>intense training</small></h1> </div> <div class="large-12"> <h2><small>train champ</small></h2> </div> <div class="large-12"> <img src="image.jpg" alt="this image"> </div> </div>

see https://developer.mozilla.org/en-us/docs/web/css/text-overflow tells you:

this keyword value indicates display ellipsis ('…', u+2026 horizontal ellipsis) >represent clipped text.

which means both declared charset , font should back upwards u+2026 proper display.

notice authors encouraged utilize utf-8.

so please verify problem problem still exists when alter charset utf-8 , utilize font back upwards u+2026.

the text-overflow property accepts string instead of ellipsis (experimental) syntax can utilize firefox.

css3

Comments

Popular posts from this blog

php - Android app custom user registration and login with cookie using facebook sdk -

django - Access session in user model .save() -

php - .htaccess Multiple Rewrite Rules / Prioritizing -