<html>
<head>
<base href="https://bugs.webkit.org/" />
</head>
<body>
<p>
<div>
<b><a class="bz_bug_link
bz_status_RESOLVED bz_closed"
title="RESOLVED INVALID - em-based media queries in <source> are relative to <html> instead of browser default font"
href="https://bugs.webkit.org/show_bug.cgi?id=159635#c4">Comment # 4</a>
on <a class="bz_bug_link
bz_status_RESOLVED bz_closed"
title="RESOLVED INVALID - em-based media queries in <source> are relative to <html> instead of browser default font"
href="https://bugs.webkit.org/show_bug.cgi?id=159635">bug 159635</a>
from <span class="vcard"><a class="email" href="mailto:jan.widmer86@gmail.com" title="Jan Widmer <jan.widmer86@gmail.com>"> <span class="fn">Jan Widmer</span></a>
</span></b>
<pre>Hi Myles C. Maxfield,
I Agree with you, but there is a different behaviour between a normal Media Query with em and the media query used in a <source> tag within the picture element. Check out my Demo: <a href="http://codepen.io/janwidmer/pen/XpBYWM">http://codepen.io/janwidmer/pen/XpBYWM</a>
There is a small red box (Viewport Indicator) on the bottom right corner which shows the current viewport based on an standard "em media query". The displayed image swwitches at the same time as the "Viewport Indicator".
As soon as you uncomment the font-size definition on the html tag, the image does NOT switch at the same time as the Viewport Indicator anymore, because the media Query within the source media attribute seems to get affected by the font-size: 62.5%, but the normal Media query doesen't.
Shouldn't they behave the same?
Best Regards
Jan</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>