I have implemented the code below for redirecting my website in an iframe, and it displays perfectly on all browsers except Safari on iPhone. I have tested it on various models of iPhones.
<head>
<title>My Website</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<frameset rows="100%,*" border="0">
<frame src="https://website.com/customer?id=104" frameborder="0" />
<frame frameborder="0" noresize />
</frameset>
When the website loads in any browser, it redirects to my site and displays correctly on different screens. However, when opened on iOS mobile phones, it does not respond properly and shows a strange layout.
I tried replacing the frameset with an iframe using the code below, but the issue persists.
<head>
<title>My Website</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style type='text/css'>
body, html
{
margin: 0; padding: 0; height: 100%; overflow: hidden;
}
#content
{
position:absolute; left: 0; right: 0; bottom: 0; top: 0px;
}
</style>
</head>
<body>
<div id="content">
<iframe width="100%" height="100%" frameborder="0"
src="https://website.com/customer?id=104">
</iframe>
</div>
</body>