http://jsfiddle.net/nicktheandroid/3LxRr/
When highlighting a paragraph containing a link that’s set to “display:inline-block”, there appears a little white block over the top of the link ( when it’s selected/highlighted). press Ctrl+A to select everything on the page and you’ll see what the problem is.
If I change the line-height down to 16px – it goes away, but the line-height for the paragraph and the link are the same. I need the link to be displayed as an inline-block because I have tool tips that pop up, and if the link gets split in half by a new line, the tool tip appears in the middle of the page, so inline-block is a must.
It only happens in webkit browsers (Chrome and Safari). It’s something about how the browser engine renders text selection highlight and is not really a CSS issue. because when you apply background color your code will work same in every browser.
If you believe it’s a bug you can report it to webkit.org