SVG background is clipped when scaled

UNCONFIRMED
Unassigned

Status

()

Core
SVG
UNCONFIRMED
3 years ago
11 months ago

People

(Reporter: meatlightning, Unassigned)

Tracking

32 Branch
x86
Mac OS X
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(1 attachment)

(Reporter)

Description

3 years ago
Created attachment 8476826 [details]
Screen Shot 2014-08-21 at 10.51.18 AM.png

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.9; rv:32.0) Gecko/20100101 Firefox/32.0 (Beta/Release)
Build ID: 20140814150857

Steps to reproduce:

http://jsfiddle.net/1y0ktppt/

1. create element w/ SVG image background
2. style element using relative units (em) for height & width
3. apply font-size to parent element


Actual results:

SVG scales but edges are clipped (e.g. a circular icon ends up with flat edges) depending on combination of parent and target element's font-size.

You can edit the font-size applied to the body in the example fiddle to see the clipping behavior across various sizes. http://jsfiddle.net/1y0ktppt/


Expected results:

SVG should not be clipped.
I think this is a version of bug 1003213.
Status: UNCONFIRMED → RESOLVED
Last Resolved: 3 years ago
Resolution: --- → DUPLICATE
Duplicate of bug: 1003213
(Reporter)

Comment 2

3 years ago
I'm still seeing the issue using FF34.0 on OSX 10.9.5

Here's a screengrab from the fiddle linked in the original report: http://imgur.com/fXbCwpJ (note the clipping on the smallest icon)

Should I open a new issue?
Status: RESOLVED → UNCONFIRMED
Resolution: DUPLICATE → ---
You need to log in before you can comment on or make changes to this bug.