How to use @media within the iframe?

Put the website in iframe.
<div class="outer">
 <iframe src="http://inner.com" style="width:300px;height:500px;"></iframe>
</div>

The internal layout of the site write
html, body {
 height: 100%;
 width: 100%;
}

@media (max-width : 600px) {
 body {
 border: 1px solid red;
}
 }

Due to the fact that at external website frame size specified 300х500, the inside of the frame triggers the@media (max-width : 600px), although the size of the screen much more. I tried to use @media (max-device-width : 600px), also not working.

Inside the iframe to take into account the screen size, not the size of the iframe?
April 3rd 20 at 18:52
1 answer
April 3rd 20 at 18:54
Solution
It seems to be possible to use max-device-width but it will soon be cut everywhere.

The correct answer is no. To connect to a page in a frame of their own, simplified style sheet. And adaptiv for example, relocate and connect only the parent

Find more questions by tags CSS