How To Fix SVG Height in Webkit/Blink

It’s pretty simple: also specify a height if you specify a width. To quote from the workaround in my stylesheet, which I added on account of my previous post:

figure svg {
	width:100%;
	/*what follows is because Webkit/Blink is broken https://bugs.webkit.org/show_bug.cgi?id=68995*/
	height:100%
}

I really shouldn’t have added that as I don’t cater to broken browsers anymore, but I have a bit of a soft spot for Opera—even if it’s never required any workarounds before. Presto is clearly superior, and so is Gecko. Chromium still doesn’t support SVG favicons. Gecko does. And just look at this table. Unfortunately Gecko doesn’t support SVG fonts, so it’s all looking pretty miserable without Presto.

1 Comment

  1. [...] versions of linear-gradient if desired, albeit you do still save an HTTP request and you avoid one of Webkit/Blink’s bugs. Yes, every browser has bugs. However, in Presto, Gecko, and Prince, things just work for me, while [...]

    July 20, 2013 @ 10:39Permalink
    Cutting Corners With Linear Gradients | The One with the Thoughts of Frans

RSS feed for comments on this post· TrackBack URI

Leave a Comment

You must be logged in to post a comment.