Fonts look blurred in different areas of a webpage
I am using a monospace font in the text on my webpage. For larger sizes, the font appears to be normal without any discrepancies; however, in small paragraph-appropriate sizes, the variations in the font become more noticeable to the point where certain characters(the number 1) appear bulged in one end. Notice that this does not occur for all instances of the character; for some instances, there is no discrepancy. I am certain that this is caused due to font spacing and that they are caused when the character ,"lands" in the middle of a pixel.
Notice: I am using Mac OS X with sub-pixel anti-aliasing turned on. This is not causing the issue.
Edit: I am using Meslo LG M as the font.