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.

Sign up for GitHub

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

Jump to bottom

removeViewBox breaks scaling SVGs with CSS #1126

Closed
cpmsmith opened this issue Jul 10, 2019 · 3 comments
Closed

removeViewBox breaks scaling SVGs with CSS #1126

cpmsmith opened this issue Jul 10, 2019 · 3 comments

Comments

@cpmsmith
Copy link

#139 deals with a similar topic, but this is true for inline SVGs across browsers. I'd argue removeViewBox should be off by default.

Example:

<html><head>
  <style>
    svg {
      width: 50px;
      height: 50px;
    }
  </style>
</head><body>
  <svg width="100" height="100" viewBox="0 0 100 100">
    <circle fill="green" cx="50" cy="50" r="50"></circle>
  </svg>
  <svg width="100" height="100">
    <circle fill="red" cx="50" cy="50" r="50"></circle>
  </svg>
</body></html>

Rendered:

image
@GreLI
Copy link
Member

GreLI commented Jul 13, 2019 •
edited
Loading

That's an incorrect styling in a page and has nothing to do with SVGO. SVGO doesn't know anything about context in which image is used, so responsibility for its usage lies on whoever runs it.

@GreLI GreLI closed this as completed Jul 13, 2019
@cpmsmith
Copy link
Author

@GreLI What about that is incorrect?

@GreLI
Copy link
Member

GreLI commented Jul 13, 2019 

<style>
    svg {
      width: 50px;
      height: 50px;
    }
  </style>

overrides inline attributes styles, so they aren't source of truth anymore.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@GreLI @cpmsmith