keep RWD effect when embed shiny app in an iframe

Posit Professional & Hosted Products shinyapps.io
1

Hi,

I found that once you embed an shiny app in an iframe, then the RWD effect will disappear.

image
image434×714 3.13 KB

I tried to set width to be 70% in the html but the resolution would be bad...
image
image462×741 2.95 KB

How can I make the embedded shiny app act like one that is not in an iframe?
I want the app act like this when embedded in an iframe

image
image384×731 5.29 KB

here's the reprex html:

<!DOCTYPE html>
<html>
<head>
	<style type="text/css">
		#gis {height: 500px; width:100%;}
		@media screen and (max-width: 1000px) {
			#gis {height: 90vh; width:70%;}
		}
	</style>
</head>
<body>
	<iframe id="gis" src="http://yenping.shinyapps.io/test/"></iframe>
</body>
</html>

Very appreciated!

2

okay...
So I found something here

iframe source domain is not the same as your main page which renders this iframe: In this case you cannot do much with the iframe except displaying it in your page. The browser will not allow you to change any stuff on this iframe. This is a security protocol followed in all the browsers.

Does it mean that there's nothing I can do...? :thinking::thinking: