In my site I need to display "—", but it looks like :
( http://i.imgur.com/CiLIo.png )
in Google Chrome and Opera, but looks ok in Firefox and IE9.
Can someone supply working code of this sign ?
I can't be sure what you want to display 100%, since I am on Chrome :), but that looks like an m-dash and the correct way to display it would be to write in your code — or —. It could be thought that that character is missing from the font Chrome and/or Opera is using on your system.
Check out this link: http://tlt.its.psu.edu/suggestions/international/web/codehtml.html
To quote it:
“Smart (curly) quotes” (vs. "plain (straight) quotes") and long dashes such as em dash (—) and en dash (–) are actually considered "special characters" in HTML.
So use an m- or n-dash: — or –
The odds are that the page uses some odd font that is broken, containing “ó” in place of the em dash, and that some browsers are able to analyze the font better than others. If this were just an encoding problem (which was my first thought, too), then surely — would work.
It would be an odd font, but it’s impossible to analyze the issue further without more information. A URL would probably suffice.
Try adding this line in your document <head>:
<meta charset="utf-8">
Charset sets a character encoding that specifies to the browser / document reader what kind of characters to expect. That way, it can handle your text appropriately and in an expected manner. In this case, we're using "utf-8" as it supports a wider range of characters.
Also / otherwise, click the Wrench icon in Chrome, hover to Tools, hover to Encoding, and see which encoding is checked.
Related
tl;dr; - use the toggle button, see what happens:
jsfiddle.net/zt6gapL5/
When building a website, I naturally have a lang="xx" attribute on mu HTML tag. Took a while to delete each and every part of the document, to finally realise that it was causing my font to look totally different. The website is in "bg", but the design I've been given, using that exact same font, must be with a lang="en" in order to look right.
On chrome, when I put
-webkit-locale: "en"
as CSS, it works. But only for chrome, obviously.
As you can see, the font is totally different:
lang="bg":https://i.stack.imgur.com/da0gf.png
lang="en":https://i.stack.imgur.com/pP6Cp.png
Option 1: using lang="en", when the site is NOT in EN
Option 2: removing the lang attribute whatsoever. Does the meta tag still work?
Option 3: Using CSS to fix things, however I couldn't find a solution for firefox...
-webkit-locale: 'en'; fixes the problem for webkit browsers. Sadly diversity is against me this time.
Maybe this will help get the right characterset. https://en.wikipedia.org/wiki/KOI8-U ....KOI8-U (RFC 2319) is an 8-bit character encoding, designed to cover Ukrainian, It is based on KOI8-R, which covers Russian and Bulgarian
I have a page that needs to display the Unicode character ♿ or ♿, the wheelchair symbol.
IE 11 and firefox display it correctly Chrome will not display it.
I am using the character as part of a CSS rule:
span.seat.Wheelchair:after{
color:blue;
content:"\267f";
}
Is there anyway to make this work in Chrome?
Unfortunately, Chrome doesn't support Emoji at this time so there's really nothing you can do to make that character to show up. You can always try starring the issue on the issue tracker but that probably won't bring about a fix any faster.
As a workaround, you can use an image of the wheelchair instead of the character itself or find a font that offers the character you are looking for. If you are adamant about using the specified character, you can try to modify the CSS only for your Chrome users (see this question).
As part of an HUD I'm designing, I'd like to use this symbol: 🏥
Since my site serves files in Windows-1252, any characters outside the 0-255 range are represented as &#x____;, with appropriate hex digits filling in the blank. In this case: 🏥
However, when testing this out I noticed that IE can render the symbol, but Chrome cannot. I guess this question is this: What does IE have that Chrome doesn't, is there any way to give Chrome the ability to render these symbols, and if not can I detect that and replace it with an image?
It is not only enough to properly encode the charset information inside your HTML document, but on the other hand, the browser must be able to use the right encoding (check the settings) and it must be able to display it. In the following example, the browser is properly configured, it is just that the operating system is not able to use UTF-8 characters:
As far as I (mis-)understood it also is a font issue, where smart browsers possibly substitute the missing char by one out of another font. The newer browsers can also be served fonts from the server. Maybe that helps.
I hope you get a better answer.
I have a webpage that uses the special character ︾ in the HTML. In Firefox 4.0B12 this looks like a double downward-pointing chevron (︾). In Internet Explorer 8.0.7600.16385, however, this it just looks like ︾.
What do I need to do to get this character to display in IE the way it does in FF?
Thanks,
PaulH
Explicitly specify a font that you know contains that character (eg in a font-family CSS rule), so that you're not relying on the font fallback functionality of the browser (which varies, but Firefox is typically better at it than IE).
U+FE3E is a character intended for use as a close bracket in vertical ideographic text (Chinese, Japanese etc). You shouldn't expect it to be available on a machine that doesn't have East Asian fonts installed, and using it to get a particular shape unrelated to parentheses is really a misuse. I would not use it on the web. There are a limited number of ‘symbol’ characters that generally render reliably across the main OS default installs and this isn't one of them.
Make sure to end the character reference with a semicolon, like ︾.
You need to include the semi-colon after the HTML code: ︾.
I am using the Unicode 'CHECK MARK' (U+2713) in a html document. I find that it renders OK in most browsers, but occasionally I encounter someone with a missing font on their PC. Are there any HTML / JS tricks to specify an alternative display character (or an image) if the font is missing?
There's not a direct way to tell if any particular character has rendered in a useful way. About all you can do from JavaScript is to create a <span> containing one (or several) of the target character in the target font, and compare its width to another <span> containing the same number of characters you know won't render usefully(*). If they're the same width, chances are you've got a load of boxes or question marks in each, so you can take backup measures like adding an image.
Since this is quite a lot of annoyance you may prefer to just go for the image. Or you could try using #font-face embedding on modern browsers to use a known-good font in general. Since it is typically IE that has poor Unicode font fallback support, be sure to include an EOT font.
(*: you could try a character that's currently unassigned and will hopefully stay that way, eg. U+08FF, or a guaranteed-invalid character like U+FFFF, though it's questionable whether you should be allowed to put that in an HTML document.)
This is not quite what you're asking for, but it might solve your problem (assuming your goal is to output HTML without it needing to rely on outside images, etc)
Have you considered image data URLs (also known as RFC2397):
http://www.ietf.org/rfc/rfc2397.txt
Instead of using:
✓
to represent a check mark, you would use:
<img src="data:image/gif;base64,R0lGODlhCgAKAJEAAAAAAP///////wAAACH5BAEAAAIALAAAAAAKAAoAAAISlG8AeMq5nnsiSlsj
zmpzmj0FADs="/>
This won't require any particular Unicode fonts with the CHECK MARK character to be installed on the client side, BUT it won't work in Internet Explorer 7 or lower. (Internet Explorer 8, Firefox, Safari, etc. should work just fine)
If you can devise a way to remotely check if MS Office 2000 or newer is installed, you should be able to assume that Arial Unicode MS is installed and hence having this code point in a font (as long as you have the CSS font family set to something like "Arial Unicode MS, Arial, sans-serif").
I believe this will only work in Microsoft Internet Explorer, but you should be able to detect a Word installation by trying to create its ActiveX object in JavaScript:
if(new ActiveXObject("Word.Application"))
{
window.alert("Word is installed, go ahead and use the Unicode check mark in HTML");
}
else
{
window.alert("Word is not installed, use your image of a check mark.");
}
But given that this really only works in IE, will probably throw a security warning in IE8, and you still need a fallback mechanism for other browsers or IE browsers without MS Office, using an image all the time is probably the best way to go.
Unicode is pretty standard, I always use unicodemap.org. Here is the character your using [link] this will give you all codes associated with the checkmark. If you want full backwards compatibility you will need to use an actual image. 1 image file for a checkmark is more lightweight than a javascript hack/plugin. Probably your best alternative.