<html>
<head>
<base href="https://bugs.webkit.org/" />
</head>
<body>
<p>
<div>
<b><a class="bz_bug_link
bz_status_NEW "
title="NEW - Changing canvas height immediately after page load does not relayout canvas"
href="https://bugs.webkit.org/show_bug.cgi?id=156097#c11">Comment # 11</a>
on <a class="bz_bug_link
bz_status_NEW "
title="NEW - Changing canvas height immediately after page load does not relayout canvas"
href="https://bugs.webkit.org/show_bug.cgi?id=156097">bug 156097</a>
from <span class="vcard"><a class="email" href="mailto:david+webkit@limnu.com" title="David <david+webkit@limnu.com>"> <span class="fn">David</span></a>
</span></b>
<pre>(In reply to <a href="show_bug.cgi?id=156097#c9">comment #9</a>)
<span class="quote">> I think it is a bug, because it works in contexts other than flexbox.</span >
I'm guessing it's confusing because people have tried to make it easy and convenient to set both the resolution and layout size at the same time using the width and height attributes.
But when you let flexbox handle the layout, then setting the width or height attributes should only affect the resolution, because flexbox has constrained the layout size. It makes sense that setting width doesn't do what you expect when flexbox is involved, and does when flexbox isn't.
If you draw on the canvas after setting the width or height attributes, you will see that the backing store resolution is changing.
Try this, for example, and try changing the width & height.
setTimeout(function() {
canvas.height = 200;
canvas.width = 2000;
var c=document.getElementById("canvas");
var ctx=c.getContext("2d");
ctx.rect(20,20,150,100);
ctx.stroke();
}, 0);
So, I still don't think this is a bug. Use the CSS style attributes to change the layout of a canvas.</pre>
</div>
</p>
<hr>
<span>You are receiving this mail because:</span>
<ul>
<li>You are the assignee for the bug.</li>
</ul>
</body>
</html>