New issue

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

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

0 value compression rule breaks transform origin behavior #99

Open
webspinner opened this Issue Aug 13, 2013 · 5 comments

Comments

Projects
None yet
7 participants
@webspinner

webspinner commented Aug 13, 2013

css = css.replaceAll("(?i)(^|[^0-9])(?:0?\\.)?0(?:px|em|%|in|cm|mm|pc|pt|ex|deg|g?rad|m?s|k?hz)", "$10");
// Replace 0 0 0 0; with 0.
css = css.replaceAll(":0 0 0 0(;|})", ":0$1");
css = css.replaceAll(":0 0 0(;|})", ":0$1");
css = css.replaceAll(":0 0(;|})", ":0$1");

These lines lead to the following change in code:

-webkit-transform-origin: 0px 0px;

into:

-webkit-transform-origin: 0;

which does something very different than one might expect. In this case the default y origin transform is 50%, so the text will be unexpectedly offset by 50% the height of the element.

Thanks for all your hard work on this utility.

@ghost ghost assigned tml Aug 14, 2013

@beejjorgensen

This comment has been minimized.

Show comment
Hide comment
@beejjorgensen

beejjorgensen Sep 12, 2013

Probably related:

This:

.foo { -webkit-animation-duration: 1.0s; }

Minifies to this (missing the units):

.foo{-webkit-animation-duration:1.0}

"1.00s" in the input produces "1.00s" in the output, as expected.

beejjorgensen commented Sep 12, 2013

Probably related:

This:

.foo { -webkit-animation-duration: 1.0s; }

Minifies to this (missing the units):

.foo{-webkit-animation-duration:1.0}

"1.00s" in the input produces "1.00s" in the output, as expected.

@Strahinja

This comment has been minimized.

Show comment
Hide comment
@Strahinja

Strahinja Jul 22, 2014

I had a similar problem with

transition: opacity 0.3s, visibility 0s linear 0.3s;

and "0s" becoming "0", which makes the latest version of Firefox refuse to accept such declaration. Replacing "0s" with "0.00s" solved my problem.

Strahinja commented Jul 22, 2014

I had a similar problem with

transition: opacity 0.3s, visibility 0s linear 0.3s;

and "0s" becoming "0", which makes the latest version of Firefox refuse to accept such declaration. Replacing "0s" with "0.00s" solved my problem.

@tml tml self-assigned this Oct 1, 2015

@HarlesPilter

This comment has been minimized.

Show comment
Hide comment
@HarlesPilter

HarlesPilter Mar 17, 2016

Same issue here with "transition-delay" and "transition" itself
"transition: all .1s linear 0s" -> "transition:all .1s linear 0 and that's invalid on latest Chrome
Going from 0s to 0.00s doesn't help either.

HarlesPilter commented Mar 17, 2016

Same issue here with "transition-delay" and "transition" itself
"transition: all .1s linear 0s" -> "transition:all .1s linear 0 and that's invalid on latest Chrome
Going from 0s to 0.00s doesn't help either.

@element-code

This comment has been minimized.

Show comment
Hide comment
@element-code

element-code May 24, 2016

Not fixed?
visibility 0s .5s minifies to visibility 0 .5s .. the complete transition rule was ignored!

element-code commented May 24, 2016

Not fixed?
visibility 0s .5s minifies to visibility 0 .5s .. the complete transition rule was ignored!

@Tofandel

This comment has been minimized.

Show comment
Hide comment
@Tofandel

Tofandel Aug 6, 2018

The transition delay is not the same issue
My PR fixes the transition issue but not the transform-origin issue
#312

Tofandel commented Aug 6, 2018

The transition delay is not the same issue
My PR fixes the transition issue but not the transform-origin issue
#312

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