Skip to content
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

[Bug] : Minification breaks the aspect-ratio property #963

micahlt opened this issue Nov 7, 2020 · 2 comments

[Bug] : Minification breaks the aspect-ratio property #963

micahlt opened this issue Nov 7, 2020 · 2 comments


Copy link

micahlt commented Nov 7, 2020

Describe the bug
When run through cssnano, values for the aspect-ratio CSS property (such as 4 / 3) are automatically converted into decimals (1.3333333). This fully breaks aspect-ratio in all major browsers.

To Reproduce
Steps to reproduce the behavior:

  1. Use the aspect-ratio property
  2. Run the stylesheet through cssnano
  3. Open the result in a browser
  4. See error

Expected behavior
I would expect cssnano to recognize instances of this property and leave them as fractions.

If applicable, add screenshots to help explain your problem. (from cssnano-playground)

Desktop (please complete the following information):

  • CSSNANO Version 4.1.10
  • Plugins/presets versions
    OS: Windows 10 10.0.19041
    CPU: (12) x64 Intel(R) Xeon(R) CPU           W3680  @ 3.33GHz
    Memory: 8.36 GB / 15.99 GB
    Node: 14.10.1 - C:\Program Files\nodejs\node.EXE
    npm: 6.14.8 - C:\Program Files\nodejs\npm.CMD
    Gradle: 6.6.1 - C:\Gradle\gradle-6.6.1\bin\gradle.BAT
    pip3: 20.1.1 - ~\AppData\Local\Programs\Python\Python38-32\Scripts\pip3.EXE
    Git: 2.28.0. - C:\Program Files\Git\cmd\git.EXE
    Windows SDK:
      AllowDevelopmentWithoutDevLicense: Enabled
    Android Studio: Version AI-193.6911.18.40.6626763
    Bash: 4.4.23 - C:\Program Files\Git\usr\bin\bash.EXE
    Perl: 5.32.0 - C:\Program Files\Git\usr\bin\perl.EXE
    Python: 3.8.5 - C:\Users\Micah\AppData\Local\Programs\Python\Python38-32\python.EXE
    Chrome: 86.0.4240.183
    Edge: Spartan (44.19041.423.0), Chromium (86.0.622.63)
    Internet Explorer: 11.0.19041.1

+-- cssnano@4.1.10
+-- parcel@1.12.4
| +-- cssnano@4.1.10  deduped
| `-- htmlnano@0.2.6
|   `-- cssnano@4.1.10  deduped
`-- parcel-bundler@1.12.4
  `-- cssnano@4.1.10  deduped

Additional context
I'm aware browser support for the aspect-ratio property is limited, but it would be great to go ahead and support it.

Copy link

Thanks for the issue.

Can you please share the link from cssnano playground with your code block

This is working file

@ludofischer ludofischer added this to the 5.0.0 milestone Mar 19, 2021
Copy link

Fixed in cssnano 5.0.0-rc.2

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

No branches or pull requests

3 participants