TremulaJS icon indicating copy to clipboard operation
TremulaJS copied to clipboard

Chome: sub-pixel positioning makes item content blurry.

Open mottey opened this issue 10 years ago • 3 comments

When using Tremula with the Pinterest layout in Chrome I get blurry text/content in grid items. Seems to be related to it's sub-pixel positioning. (ie. transform: translate3d(63.5px, 176.952176112737px, 0px); ).

Any ideas on how to best fix this?

Thanks!

mottey avatar Oct 23 '14 10:10 mottey

Hi Mottey,

Yes, I have seen this behavior but it's not consistent and not really necessarily related to sub-pixel placement.

Take a look at the screenshot below -- these items are ultimately calculated and assigned the same way as the Pinterest layout-- here is the url:

screen shot 2014-10-23 at 10 48 16 am

This screenshot was taken with the following configuration...

  • The environment is chrome on OS X with a retina screen
  • The font is Helvetica.
  • The font-smoothing is default.

If in your case, if it's caused by the OS or Screen resolution then you may be able to improve things by using different fonts, font sizes or rendering settings.

Let me know what your config is -- maybe I can try to replicate that here.

Hope this helps...

garris avatar Oct 23 '14 18:10 garris

You're right that it's environmental and has many factors!

I'm using Win8/Chrome 38 and your art.com example is blurry for me too...

I'll keep investigating, thanks!

mottey avatar Oct 23 '14 20:10 mottey

Thanks. Please let me know if you find anything interesting... :)

I will ask around here also to see if anyone else has come across this issue and found a workaround.

garris avatar Oct 23 '14 21:10 garris