0

When designing a web page, I found characters like '✔' cannot appear at all in Firefox when they can in Chrome.

Example CSS code corresponding an input which type is 'check':

#todo-list li .toggle:after {
content: '✔';
/* 40 + a couple of pixels visual adjustment */
line-height: 43px;
font-size: 20px;
color: #d9d9d9;
text-shadow: 0 -1px 0 #bfbfbf;
}

It works in Chrome just perfectly. Sorry I don't have enough credits to post images. But when in Firefox, the character just doesn't come out, but display as a regular checkbox. I HAVE set my charset as 'utf-8' in the html file.

Richard
  • 106,783
  • 21
  • 203
  • 265
Jason Lam
  • 1,342
  • 3
  • 14
  • 17
  • The characters are showing here in Firefox (v31). Could it be a font problem? What font are you using in Chrome, what font in Firefox? – Richard Jul 24 '14 at 06:53
  • 1
    "As a regular checkbox"? So that means the character *does* appear, it just looks like a checkmark with a box instead of just a checkmark? An image would really help here. Upload it somewhere and post a link to it. – deceze Jul 24 '14 at 06:58
  • I'm viewing the post in Firefox 31 and I see the characters just fine. – Jim Garrison Jul 24 '14 at 07:15
  • 1
    It all depends upon the font. Some fonts contain that checkmark character and some fonts do not. – jfriend00 Jul 24 '14 at 07:27
  • What is the HTML element this is being applied to, and what other settings affect it? In particular, what is the font? – Jukka K. Korpela Jul 24 '14 at 10:20

1 Answers1

0

You will never make fonts look exactly the same in all browsers, whether the characters in question are Dingbats or not.

That being said, not all browsers have the same font family, this specific character style called Dingbat will not be the same for all browsers. But you maybe able to escape this by changing the font family, eg. font-family: Meiryo, and as you may know this won't work for users that don't have the same font family as you do.

For further information, please read this.

Community
  • 1
  • 1
BeyondNero
  • 53
  • 6