[Webkit-unassigned] [Bug 68995] Height of SVG element is incorrectly calculated when svg when width of containing element is set as a percentage

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Mon Jul 9 23:42:20 PDT 2012


https://bugs.webkit.org/show_bug.cgi?id=68995





--- Comment #9 from Myles Borins <myles.borins at gmail.com>  2012-07-09 23:42:19 PST ---
 > It doesn't because of the default value of preserveAspectRatio. Therefore WebKit is correct and Firefox and Opera are wrong on this particular part of the test.

It does take the default value of preserveAspectRation into account... the problem is that the Height is being incorrectly calculated... creating an excess buffer on the top and bottom of the svg element.  

This prevents developers from "Stacking" svg elements on top of each other in the DOM in a responsive way using div elements.

If one were to place multiple svg elements in a single div... they would not be able to have multiple viewports placed side by side in the window. The below example places 4 svg elements in a single div.  It renders as expected in all major browsers (untested in IE)

http://jsfiddle.net/teYA2/

Now if I were to place the elements into seperate divs I can use a bit of css to place four of them. Having not specified any dimension this result should "in theory" be responsive to the size of the window.

http://jsfiddle.net/KS69Z/

This above example renders as expected in firefox, but with web-kit the default calculated height for the element is based on the size of the window rather than the aspect ratio of the viewbox.

Funny enough there is a hack to fix this that works in the chrome dev past v21.x and also seems to work in the nightly build of web-kit.  Adding style="height: 100%;" seems to render the expected output (although this will not work in the public release of either browser).

http://jsfiddle.net/TmVVe/

It would seem to me like the default behavior is currently off, is it not strange that we need to specify a height of 100% with css?  Should that not be the default?

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.



More information about the webkit-unassigned mailing list