Very difficult to solve and strange CSS3 opacity transition issue (…must be a bug?)

Question

I am absolutely tearing all of my hair out with this highly frustrating and strange CSS problem I am having.

I am using the Bones boilerplate to make a website, and

Answer 1

Thanks to vals for pointing out the GPU aspect... This reminded me of this CSS-Snippet which tends to solve Chrome rendering issues:

-webkit-transform: translateZ(0);

I've applied this to the container (div.post) containing the problematic item (i.icon-) which has a fraction width, problem solved!

Credit: I've got this solution from this answer to fix incorrectly rendered (fixed) elements after navigating to an page anchor.