html - Webkit Opacity Transition Issues with Text -


status:

inside a div I have an image after the text in which it has the font-weight of 900; in my locally hosted environment I am using custom fonts, but for the next belt I chose "never-so-stylish" comic sans to clarify my point. Before anything, I set the opacity of the entire division to 0.7. However, when hovering over div , I want the ambiguity of everything to come in full opacity.

Problem:

I have seen that only the div tags in webkit will be visible and only on the hover, change the weight of the text. In reality, there is absolutely no change at all in the weight of the text, however, on the maximum and maximum review you will see that this same appears on hover over the desired weight, but rather in a temporary situation .

What I've done:
  • I tested it in all the latest versions of Chrome, Firefox, and Safari.
  • I'm currently testing on the new MacBook Pro, which is a retina screen in my case. However, my colleague only tested Bella on his iMac (non-retina display), just to clarify this issue still
  • Maybe I'm just crazy, but I think it's actually webkit browsers have chosen to present elements with different opportunities again, maybe I just do something wrong to avoid I am trying to

    And, naturally, I thought I could lighten the mood with the comic suns. There is a screen capture here to help explain the problem:

    Embrace the Comic Sons Apply it!

    Supported during animation, transit or conversion)

  • Grayscale

    its application That when an element is sung using subpixel antializing and an animation is applied to it, then webkit temporarily switches to grayscale for the duration of the animation and then once it ends up on the sub pixel. < P>

    Issue, add it to your CSS:

      html {- Webkit -font-smoothing: antialiased;}   

    It forces the forces and scans all text and you will not see switching.

    (last result :)

Comments