- This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
Viewing 6 posts - 1 through 6 (of 6 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Hey guys I’m working on a one page website with different sections, and a static navigation bar on top. On the bottom of the page there is a contact section with a contact form.
On the textfields in the contact form I use css3 transform and transitions to scale the fields to get slightly bigger and change color on hover and active state. These effects on the textfields make the links in the nav bar flicker. It seems -webkit-transform: translateZ(0px); does prevent this. The flipside is the links in the navigation gets thinner and bad rendering. I did some testing, Firefox and Chrome is fine. This only happens in Safari 5.1 in OS X Lion, is there a solution to this issue or is this a bug in Safari?
Seems like Lion is having a few troubles since released.
So this is a Safari 5.1 and OS X Lion issue? I have tested the latest Webkit build and it’s all the same.
You said it was a Lion issue, I’m not on a Mac so I can’t test. Lion has been having issues since released and this may or may not be related to that.
I’m having the same issue with Safari on mac and pc. Version 5.1. It is driving me crazy!
@ChrisCoyier made a video on Youtube of -webkit-backface-visibility. Watch the flicker at the top and then watch after he inputs code. http://youtu.be/EMmar6SqO14
Not sure if this is a solution, but try it.