Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Already on GitHub? Sign in to your account

Add -webkit-gradient syntax for old versions of Safari and Mobile Safari. #130

cvn opened this Issue Nov 12, 2013 · 4 comments


None yet
2 participants

cvn commented Nov 12, 2013

In response to Issue 58, the old -webkit-gradient syntax was added for old versions of android, but it's also needed for Safari 4.0 - 5.0 and iOS 3.2 - 4.3.

Source: thoughtbot/bourbon#219

Testing by specifying android 2.3 as a target, I also noticed that the syntax being output is slightly wrong. The horizontal/vertical positions are specified in the wrong order.

Autoprefixer outputs:
background-image: -webkit-gradient(linear, top left, bottom left, from(red), to(blue));
From this input:
background-image: linear-gradient(to bottom, red 0%, blue 100%);

top left and bottom left are incorrect, and do not render on my iPhone 3G. It needs to be left top and left bottom

Example here: http://jsfiddle.net/chad/Re55n/
Even new versions of chrome and safari will render the old syntax if the order is correct.


ai commented Dec 6, 2013

I try to fix it on this weekend.


ai commented Dec 7, 2013

Done 4343055

@ai ai closed this Dec 7, 2013


cvn commented Dec 8, 2013

Thanks @ai! This wasn't a complete fix though. You missed iOS 4.3, and the direction order was not addressed.

I submitted a pull request with the changes needed ai#140

I would have done this in the first place, but I didn't really understand how pull requests work when I submitted this issue.


ai commented Dec 11, 2013

Released in 0.8.20131209 version.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment