While I'm developing responsive website I have used this uni-code ( » ) to the read more links. It is displaying correctly in desktop browser but it is not displaying correctly in mobile devices like android or iPhone. Is it possible to display the same as in desktop..? What's the problem..? Whether the mobile device doesn't support uni-code..?
The problem is in the embedded font you use, via #font face. The version used by Android is apparently broken. It does not display “»”, and it has problems with many other Latin 1 Supplement characters too, see my test page. Something may have gone wrong when you set up the font files on your server.
The problem does not appear if you remove the font-family setting, letting each browser use its default font, or if you use Droid Sans as hosted by Google, using <link href='http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet'> and font-family: "Droid Sans", sans-serif.
The problem is most probably not in the display of a character (“»”, U+00BB RIGHT-POINTING DOUBLE ANGLE QUOTATION MARK, is very widely supported in fonts) but in the character encoding. If the encoding is not properly declared, different browsers may make different guesses.
Check out the W3C page Character encodings, and make sure that the declared encoding matches the actual one.
If problems remain, please post a URL and explain what “is not displaying correctly” means (not displaying at all? space shown? some wrong characters shown? which?).
android does not support special characters, in android we need to write > to show ">" character. why don't you use image instead of characters.
Related
I have following problem. My custom font in Wordpress, Wittenberg and Drunk Text Wide Medium, work fine in Android devices as well as in Chrome and Firefox on a PC, but not on the new Safari 14.0 version as well on all browsers in iOS devices.
It only happens with special characters like ¿ or letters with accent marks. For example I will attach some screenshots:
First example
Second example
How can I fix this issue?
Text may not display correctly if the web page uses characters that are not part of the default text encoding and the page does not indicate the correct encoding.
Is your page encoding in UTF-8 ?
https://support.apple.com/fr-fr/guide/safari/ibrw1031/mac
I was wondering, is there any way to know, whether a Unicode will be displayed correctly in most user devices?
For instance, I'm using using Unicode \u26A0, which is suppose to show a warning sign.
I didn't specify exactly what font to be used in my app. I use the above Unicode in ListPreference.
alertEmailListPreference.setSummary("(\u26A0 Email address required)");
It looks good in my device.
My only worry is whether such Unicode will be displayed correctly in other devices?
I presume nowadays Android app are using Roboto font by default. However, when I look through http://www.fileformat.info/info/unicode/char/26a0/fontsupport.htm , I don't find Roboto font is in the list.
How can I know whether the Unicode will be displayed correctly in most user devices?
Im developing my first mobile website and i just found out that this "three lines" Unicode ☰ wasn´t working on my samsung galaxy s2 so i updated that for this unicode ≡
My question is if there´s a way to ensure that the three lines shows up in every mobile browser using unicode? or should i upload a icon or images instead for the three lines?
i dont know if this has anything to do but this is the div containing the unicode
<div id="uni">
<a id="menu_bar" href="">
<p>≡ ☰</p>
</a>
</div>
thanks for the help!
According to Unify, a table that lists Unicode support across browsers and devices, U+2630 has 58% overall support while U+2261 has 96% overall support.
My question is if there’s a way to ensure that the three lines shows up in every mobile browser using unicode?
It depends on the mobile browsers you want to support. Given the abovementioned info, U+2261 is probably good enough, but if you need full support in modern browsers, consider using icon fonts or SVG images instead.
In farsi letters are attach together to form writing scripts. However when I save HTML pages using "UTF-8" or "Windows-1256" encdoings, and try to display them using webview in android, letters are diplayed seperately and in left-to-right direction (instead of RTL).
I should notice that this case is not happening in phones supporting farsi.
Correct form should be like this (snapshot from phone supporting farsi):
Bad-formed text happens in phones not supporing farsi (Persian):
It should be noticed i've used persian font in both cases.
I also see some solutions for normal Strings in java which changes character on by one in this
question
My question: Can i fix this cases (or it should be fix by phone vendors)? if possible what is solution?
I hit this bug a lot when I was doing keyboards. The problem is that the build in canvas.drawText function in Android didn't support RTL languages. There was a patch for it, but it wasn't part of the default build of Android. So only models going out to those parts of the world that used it tended to have it. Unfortunately I know of no way to test whether it has the patch. And if it doesn't, there's no way to fix it. You could try reversing the text, but then you'd break devices which did have the patch.
Long story short- there is no way to fix it. However, I'd be shocked if Google hasn't picked up the patch in mainline by now (it existed back in the 2.2 days), so its a shrinking number of phones effected.
You can try making html with reverse font sequence! just write a windows app to get font and deliver reverse one, and use it in your android device
The website is tavistockrestaurants.com. We are trying to make this design work well in popular mobile devices. A particular android device seems to be enlarging the text, and I am unsure why. This causes the "contact" link in the top to wrap, and causes unecessary line breaks throughout our website. Notice the form is getting pushed below the images in this screenshot? It's supposed to have white space on the bottom!
We do have -webkit-text-size-adjust: none in place for all elements (using asterisk *). Is there an android equivelant? Has anyone experienced this on any android devices?
This behavior does not occur on all android devices. We have only seen this on Android 4.x, but I cannot reproduce it with my android 4.0 emulator.
What it currently looks like:
What it should look like:
(I do not have the specific device model used in the screen cap)
In CSS, pixels are not pixels.
Or rather, 1 CSS pixel does not always map to 1 hardware pixel. On certain high-DPI Android devices, one CSS pixel can be 1.5 or 2 hardware pixels. The Opera guys have a good overview on the topic.
Samuels answer is correct.
There is a workaround though. You can target specific devices and change the styles for that device specifically using classes or stylesheets. If you are using PHP you should be able to parse the "User-Agent" and determine which device the client is using and add a class to the body tag (and use that class to target that specific device in your CSS).
There are also services that will allow you to send users to a different version of the site depending on the device they are using. Here is a site that does the work for you.
There may also be device specific CSS being generated on loading the page. Using a CSS reset may also help your site be more cross-browser compatible.