Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

-webkit-gradient issue #112

Closed
fredburger opened this Issue · 6 comments

3 participants

@fredburger

Input (Bootstrap):

.carousel-control.left {
  background-image: -webkit-gradient(linear, 0 top, 100% top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.0001)));
  background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, 0.5) 0), color-stop(rgba(0, 0, 0, 0.0001) 100%));
  background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5) 0, rgba(0, 0, 0, 0.0001) 100%);
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0, rgba(0, 0, 0, 0.0001) 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
}

Output (note multiple -webkit-*):

.carousel-control.left {
  background-image: -webkit-gradient(linear, 0 top, 100% top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.0001)));
  background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, 0.5) 0), color-stop(rgba(0, 0, 0, 0.0001) 100%));
  background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5) 0, rgba(0, 0, 0, 0.0001) 100%);
  background-image: -webkit-gradient(linear, top left, top right, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.0001)));
  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5) 0, rgba(0, 0, 0, 0.0001) 100%);
  background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5) 0, rgba(0, 0, 0, 0.0001) 100%);
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0, rgba(0, 0, 0, 0.0001) 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
}
@ai
Owner
ai commented

The main idea behind Autoprefixer is to write CSS without prefixes by latest W3C specs. So, work with legacy code is not prior high priority. I will fix it, but not soon :).

But, your PR is always welcome :).

@fredburger

Hm, ok. But it's an interesting feature to realign precompiled CSS with selected browser versions.

Anyway, thanks for sharing your great work with Autoprefixer!

@ai
Owner
ai commented

Autoprefixer add double -webkit-gradient because first prefix use different direction -webkit-gradient(linear, 0 top, 100% top. I think to close this issue, because fix will be bad for code climate :).

@ai ai closed this
@bassjobsen bassjobsen referenced this issue from a commit
Commit has since been removed from the repository and is no longer available.
@cvrebert

@ai Would you consider reopening this issue? Now that Autoprefixer is part of Bootstrap's build process, we're running into this bug.

@ai ai reopened this
@ai
Owner
ai commented

@cvrebert bug is only with bigger, but working code?

@cvrebert

We now believe it was a bug on our side. Sorry for the noise. Thanks for such a great tool!

@ai ai closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.