iPhone monospace font isn't
August 31, 2008 at 10:00 AM by Dr. Drang
This is really weird. I was looking at my site on my iPhone, and I noticed that the pipe characters (|) in this post that were supposed to be aligned weren’t. My first thought was that I had somehow, embarrassingly, messed up the alignment in a post that was all about alignment. It turns out my post was fine—the alignment is perfect when viewed on a computer—it’s the iPhone monospaced font, or how it gets spaced in Safari, that’s messed up.
Here’s a <pre><code> block with letters, numerals, and punctuation:
abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ
12345678901234567890123456
--------------------------
__________________________
??????????????????????????
==========================
..........................
,,,,,,,,,,,,,,,,,,,,,,,,,,
;;;;;;;;;;;;;;;;;;;;;;;;;;
::::::::::::::::::::::::::
!!!!!!!!!!!!!!!!!!!!!!!!!!
''''''''''''''''''''''''''
""""""""""""""""""""""""""
//////////////////////////
||||||||||||||||||||||||||
**************************
$$$$$$$$$$$$$$$$$$$$$$$$$$
##########################
@@@@@@@@@@@@@@@@@@@@@@@@@@
((((((((((((((((((((((((((
))))))))))))))))))))))))))
[[[[[[[[[[[[[[[[[[[[[[[[[[
]]]]]]]]]]]]]]]]]]]]]]]]]]
{{{{{{{{{{{{{{{{{{{{{{{{{{
}}}}}}}}}}}}}}}}}}}}}}}}}}
++++++++++++++++++++++++++
There are 26 characters in each line, and the lines should all be of the same length. If you’re looking at this page on a desktop or notebook computer, the lines will be of the same length. If you’re looking at it in Mobile Safari on your iPhone, the line of hyphens and the line of question marks will be longer. Here’s a screenshot:
I don’t know whether the character sizes of the hyphen and the question mark are different or if there’s something in Mobile Safari that makes them spaced a bit more. Either way, it’s odd.
Update
Just realized the title says “monospace” instead of “monospaced.” I was in a hurry.
