Not a real answer but could help somebody else find a work around for this bug in IE.
Page containing iframes
<link href="style.css" rel="stylesheet">
Iframe pages
<link href="style.css?frameX" rel="stylesheet">
The param frameX prevents IE from caching the css page and thus the iframe has responsive layout independently from the other pages. This is just a hack(horrible one) and to help somebody else find the answer to this problem.
Sample files
Index.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="style.css" rel="stylesheet">
</head>
<body>
<p></p>
<hr>
250px frame
<iframe frameBorder="0" src="frame1.html" height="100" width="250" id='frame_1'></iframe>
<hr>
350px frame
<iframe frameBorder="0" src="frame2.html" height="100" width="350" id='frame_2'></iframe>
<hr>
390px frame
<iframe frameBorder="0" src="frame3.html" height="100" width="390" id='frame_3'></iframe>
</div>
</body>
frame1.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="style.css?page=frame1" rel="stylesheet">
</head>
<body>
<p></p>
</body>
</html>
frame2.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="style.css?page=frame2" rel="stylesheet">
</head>
<body>
<p></p>
</body>
</html>
frame3.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="style.css?page=frame3" rel="stylesheet">
</head>
<body>
<p></p>
</body>
</html>
style.css
iframe{display:block;}
@media (max-width: 8000px)
{
body p:before {content: "bigger than 550px";}
}
@media (max-width: 550px)
{
body p:before {content: "max550";}
}
@media (max-width: 450px)
{
body p:before {content: "max450";}
}
@media (max-width: 350px)
{
body p:before {content: "max350";}
}
@media (max-width: 250px)
{
body p:before {content: "max250";}
}
与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
