Geek Answers Handbook

Better anti-aliasing on iPad when using position: fixed, why?

I noticed that when used position: fixedon an element, text on the iPad (iOS 5.0.1) displays better than without position: fixed. This is especially true for white text on a dark background.

My question is how to use this improved anti-aliasing without using workarounds such as position: fixed.

Below you can find an example image and the corresponding code.

http://jsfiddle.net/t4kTm/

+5
source share
3 answers

After upgrading to iOS 5, I was no longer able to reproduce this - weird.

+1
source

I don’t know why this is so, but I know how to control anti-aliasing in webkit browsers:

-webkit-font-smoothing: none; /* Obvious */
-webkit-font-smoothing: subpixel-antialiased; /* This is what quite a few browers already do*/
-webkit-font-smoothing: antialiased; /* Even more than the one above */

Did it help?

+2

iPad position:fixed body ( -webkit-font-smoothing: antialiased). , Helvetica Neue iOS 5.1.1.

body {
  -webkit-font-smoothing: antialiased;  // make fonts thinner in desktop Webkit
  position: fixed;                      // make fonts thinner on the iPad
}
+1

More articles:


All Articles