One other equivalent simplification: if these images are all *just* being used as images (i.e. we're not having the user view them directly in a tab), we can just drop the `viewBox` attribute. Specifically for SVG-as-an-image: when we see `<svg width="someWidth" height="someHeight">` with unspecified viewBox and preserveAspectRatio, all browsers *automatically synthesize* a viewBox with position `0 0 someWidth someHeight` and with `preserveAspectRatio="none"`. So: if that's the behavior you want (and typically it is, if you're trying to make something that's analogous to a raster image but just scales more crisply), then the simplest approach is just to omit the `viewBox` and `preserveAspectRatio` attributes.
Bug 2064177 Comment 4 Edit History
Note: The actual edited comment in the bug view page will always show the original commenter’s name and original timestamp.
One other equivalent simplification: if these images are all *just* being used as images (i.e. we're not having the user view them directly in a tab), we can just drop the `viewBox` attribute. Specifically for SVG-as-an-image: when we see `<svg width="someWidth" height="someHeight">` (with unspecified viewBox and preserveAspectRatio), all browsers *automatically synthesize* attributes `viewBox="0 0 someWidth someHeight" `preserveAspectRatio="none"` for that SVG element. But if viewBox and/or preserveAspectRatio are provided, then something more subtle will happen. So: if that's the behavior you want (and typically it is, if you're trying to make something that's analogous to a raster image but just scales more crisply), then the simplest approach is just to omit the `viewBox` and `preserveAspectRatio` attributes.
One other equivalent simplification: if these images are all *just* being used as images (i.e. we're not having the user view them directly in a tab), we can just drop the `viewBox` attribute. Specifically for SVG-as-an-image: when we see `<svg width="someWidth" height="someHeight">` (with unspecified viewBox and preserveAspectRatio), all browsers *automatically synthesize* attributes `viewBox="0 0 someWidth someHeight" `preserveAspectRatio="none"` for that SVG element. But if viewBox and/or preserveAspectRatio are provided, then something more subtle will happen. In this case it seems like we want those synthesized attribute values, so we can just drop the viewBox to get them automatically and to avoid repeating ourselves (repeating the SVG dimensions in the hardcoded viewBox). So: if that's the behavior you want (and typically it is, if you're trying to make something that's analogous to a raster image but just scales more crisply), then the simplest approach is just to omit the `viewBox` and `preserveAspectRatio` attributes.